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随 着 我 国 改革 开放 的 进一步 深化 ,高 等 教育 也 得 到 了 快速 发 展 ,各 地 高 校 紧密 结合 地 方 
经 济 建设 发 展 需要 ,科学 运用 市 场 调节 机 制 , 加 大 了 使 用 信息 科学 等 现代 科学 技术 提升 、 改 
造 传统 学 科 专 业 的 投入 力度 ,通过 教育 改革 合理 调整 和 配置 了 教育 资源 ,优化 了 传统 学 科 专 
业 ,积极 为 地 方 经 济 建设 输送 人 才 , 为 我 国 经 济 社会 的 快速 ,健康 和 可 持续 发 展 以 及 高 等 教 
育 自身 的 改革 发 展 做 出 了 巨大 贡献 。 但 是 ,高 等 教育 质量 还 需要 进一步 提高 以 适应 经 济 社 
会 发 展 的 需要 ,不 少 高 校 的 专业 设置 和 结构 不 尽 合理 ,教师 队伍 整体 素质 或 待 提高 ,人 才 培 
养 模式 .教学 内 容 和 方法 需要 进一步 转变 ,学 生 的 实践 能 力 和 创新 精神 或 待 加 强 。 

教育 部 一 直 十 分 重视 高 等 教育 质量 工作 。2007 年 1 月 ,教育 部 下 发 了 《关于 实施 高 等 
学 校本 科教 学 质量 与 教学 改革 工程 的 意见 》, 计 划 实 施 “ 高 等 学 校本 科教 学 质量 与 教学 改革 
工程 (简称 “质量 工程 ')”, 通 过 专业 结构 调整 .课程 教材 建设 、 实 践 教学 改革 ,教学 团队 建设 
等 多 项 内 容 , 进 一 步 深 化 高 等 学 校 教 学 改革 ,提高 人 才 培 养 的 能 力 和 水 平 ,更 好 地 满足 经 济 
社会 发 展 对 高 素质 人 才 的 需要 。 在 贯彻 和 落实 教育 部 "质量 工程 ”的 过 程 中 ,各 地 高 校 发 挥 
师资 力量 强 , 办 学 经 验 丰富 教学 资源 充裕 等 优势 ,对 其 特色 专业 及 特色 课程 ( 群 ) 加 以 规划 、 
整理 和 总 结 , 更 新 教学 内 容 改革 课 程 体系 ,建设 了 一 大 批 内 容 新 .体系 新 方法 新 .手段 新 的 
特色 课程 。 在 此 基础 上 ,经 教育 部 相关 教学 指导 委员 会 专家 的 指导 和 建议 ,清华 大 学 出 版 社 
在 多 个 领域 精 选 各 高 校 的 特色 课程 ,分别 规划 出 版 系列 教材 ,以 配合 “质量 工程 ”的 实施 , 满 
足 各 高 校 教 学 质量 和 教学 改革 的 需要 。 

为 了 深入 贯彻 落实 教育 部 (关于 加 强 高 等 学 校本 科教 学 工作 ,提高 教学 质量 的 若干 意 
见 ) 精 神 ,紧密 配合 教育 部 已 经 启动 的 “高 等 学 校 教 学 质量 与 教学 改革 工程 精品 课程 建设 工 
作 ”, 在 有 关 专 家 、 教 授 的 倡议 和 有 关 部 门 的 大 力 支持 下 ,我 们 组 织 并 成 立 了 “清华 大 学 出 版 
社 教 材 编审 委员 会 "(以 下 简称 * 编 委 会 ”) , 旨 在 配合 教育 部 制定 精品 课程 教材 的 出 版 规划 ， 
讨论 并 实施 精品 课程 教材 的 编写 与 出 版 工作 。“ 编 委 会 "成员 皆 来 自 全 国 各 类 高 等 学 校 教学 
与 科研 第 一 线 的 骨干 教师 ,其 中 许多 教师 为 各 校 相关 院 、 系 主管 教学 的 院 长 或 系 主任 。 

按照 教育 部 的 要 求 ,“ 编 委 会 ”一 致 认为 .精品 课程 的 建设 工作 从 开始 就 要 坚持 高 标准 、 
严 要 求 , 处 于 一 个 比较 高 的 起 点 上 ; 精品 课程 教材 应 该 能 够 反映 各 高 校 教学 改革 与 课程 建 
设 的 需要 ,要 有 特色 风格 有 创新 性 (新 体系 、 新 内 容 、 新 手段 .新 思路 ,教材 的 内 容 体 系 有 和 较 
高 的 科学 创新 ,技术 创新 和 理念 创新 的 含量 )、 先 进 性 (对 原 有 的 学 科 体系 有 实质 性 的 改革 和 
发 展 ,顺应 并 符合 21 世纪 教学 发 展 的 规律 ,代表 并 引领 课程 发 展 的 趋势 和 方向 ) .示范 性 ( 教 
材 所 体现 的 课程 体系 具有 较 广泛 的 辐射 性 和 示范 性 ) 和 一 定 的 前 瞻 性 。 教 材 由 个 人 申报 或 
各 校 推荐 (通过 所 在 高 校 的 “ 编 委 会 ”成员 推荐 ) ,经 “ 编 委 会 ”认真 评审 ,最 后 由 清华 大 学 出 版 
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社 审 定 出 版 。 
目前 ,针对 计算 机 类 和 电子 信息 类 相关 专业 成 立 了 两 个 “ 编 委 会 ”, 即 “清华 大 学 出 版 社 
计算 机 教材 编审 委员 会 "和 “清华 大 学 出 版 社 电子 信 息 教 材 编审 委员 会 "。 推 出 的 特色 精品 


教材 包括 : 

(1) 21 世纪 高 等 学 校规 划 教材 。 计算 机 应 用 一 一 高 等 学 校 各 类 专业 ,特别 是 非 计算 机 
专业 的 计算 机 应 用 类 教材 。 

(2) 21 世纪 高 等 学 校规 划 教材 。 计算 机 科学 与 技术 一 一 高 等 学 校 计算 机 相关 专业 的 
教材 。 


(3) 21 世纪 高 等 学 校规 划 教材 。 电子 信息 一 一 高 等 学 校 电子 信息 相关 专业 的 教材 。 
(4) 21 世纪 高 等 学 校规 划 教材 "软件 工程 一 一 高 等 学 校 软件 工程 相关 专业 的 教材 。 
(5) 21 世纪 高 等 学 校规 划 教材 信息 管理 与 信息 系统 。 

(6) 21 世纪 高 等 学 校规 划 教材 。 财经 管理 与 应 用 。 

(7) 21 世纪 高 等 学 校规 划 教材 。 电子 商务 。 

(8) 21 世纪 高 等 学 校规 划 教材 。 物 联 网 。 


清华 大 学 出 版 社 经 过 三 十 多 年 的 努力 ,在 教材 尤其 是 计算 机 和 电子 信息 类 专业 教材 出 
版 方面 树立 了 权威 品牌 ,为 我 国 的 高 等 教育 事业 做 出 了 重要 责 献 。 清 华 版 教材 形成 了 技术 
准确 、 内 容 严 谨 的 独特 风格 ,这 种 风格 将 延续 并 反映 在 特色 精品 教材 的 建设 中 。 


清华 大 学 出 版 社 教材 编审 委员 会 
联系 人 : 魏 江 江 


E-mail: weijtup. tsinghua. edu. cn 


进入 20 世纪 90 年 代 以 后 , 随 着 互联 网 应 用 的 日 益 普及 ,Web 已 经 融入 到 人 们 生活 的 
方方面面 ,Web 技术 也 正在 悄悄 地 影响 和 改变 着 人 们 的 工作 .生活 和 思维 方式 。 在 软件 开 
发 和 计算 机 应 用 上 ,基于 Web 的 计算 机 应 用 模式 正 悄然 兴起 ,B/S 结构 在 市 场 竞争 中 已 经 
脱颖而出 ,C/S 结构 的 系统 风光 不 再 。 现 在 ,无 论 是 企业 的 电子 商务 ,还 是 政府 办 公 系统 ,可 
以 说 ,80% 以 上 的 计算 机 应 用 都 是 基于 Web 的 ,使 互联 网 这 个 现代 的 信息 平台 找到 了 最 广 
阔 的 应 用 市 场 。 今 天 , Web 已 经 成 为 人 们 一 种 基本 的 技术 素养 ,成 为 了 一 种 文化 现象 。 

身 处 教育 和 IT 两 个 领域 ,一 直 对 计算 机 软件 技术 的 发 展 非常 关注 ,希望 所 教授 的 知识 
和 社会 的 需求 紧密 相关 ,培养 的 学 生 既 有 扎实 、 宽 厚 、 系 统 的 基础 理论 知识 ,又 有 优秀 的 开发 
能 力 。 理 论 和 实践 的 结合 需要 一 个 载体 ,对 计算 机 软件 来 说 ,项 目 是 再 好 不 过 的 载体 了 。 在 
软件 项 目的 研发 中 ,我 们 可 以 对 相关 的 理论 知识 进行 应 用 验证 ; 反 过 来 ,在 软件 开发 和 应 用 
中 遇 到 的 问题 ,难题 ,又 推动 了 我 们 对 理论 问题 的 研究 。 

科研 和 教学 就 是 这 样 的 相辅相成 ,项 目 作 为 一 种 结合 点 ,推动 着 科研 和 教学 水 平 的 不 断 
提高 。 从 2001 年 开始 ,我们 开始 了 基于 B/S 三 层 架 构 的 软件 项 目的 研发 工作 ,开发 领域 主 
要 是 E-learning 与 知识 管理 ,虚拟 实验 室 , 还 有 一 些 通用 的 管理 系统 ,例如 会 议 管理 ,论文 管 
理 、 用 户 服务 支持 系统 等 。 在 这 些 Web 应 用 的 开发 中 , 遇 到 了 许 许多 多 的 问题 ,也 积累 了 很 
多 的 经 验 , 有 很 多 的 体会 。 笔 者 不 断 地 总 结 着 研究 和 开发 中 的 体会 ,在 通过 大 学 讲台 和 学 生 
们 交流 、 分 享 的 同时 ,于 2005 年 探索 性 地 出 版 了 《Web 技术 导论 ) 一 书 ,其 目的 就 是 要 在 高 
校 中 开设 一 门 全 面 反 映 Web 技术 及 应 用 的 新 的 课程 , 书 中 的 例题 和 案例 大 都 来 源 于 这 些 研 
发 项 目 。2006 年 该 书信 选 普 通 高 等 教育 “十 一 五 ”国家 级 规划 教材 。 此 后 经 过 三 年 多 的 积 
累 和 写作 ,2009 年 11 月 出 版 了 《Web 技术 导论 (第 2 版 )》。 

光阴 荃 贡 ,一 晃 又 是 三 年 过 去 了 ,在 这 三 年 中 ,笔者 从 未 放下 Web 系统 的 研发 工作 。 从 
2010 年 暑期 开始 直到 2011 年 暑期 ,笔者 利用 整整 一 年 的 时 间 重 写 了 ”面向 过 程 管理 的 网 络 
教学 平台 ”的 几乎 全 部 代码 。 从 2011 年 底 开 始 ,一 个 新 的 Web 系统 平台 , 即 “ 高 等 学 校本 科 
教学 基本 状态 数据 统计 平台 ”项 目 已 经 启动 ,这 是 一 项 新 的 挑战 ,也 充满 着 诱惑 和 快乐 。 在 
这 些 项 目的 研发 中 ,笔者 对 Web 系统 的 许多 问题 有 了 新 的 认识 和 体会 。2011 年 底 ,“Web 
技术 导论 ”课程 被 选 为 山东 大 学 核心 通 识 课程 ,同时 ,该 课程 也 被 教育 部 全 国 高 校 教师 网 培 
中 心 选 为 高 校 师 资 培训 课程 。 笔 者 想 在 讲课 以 前 ,把 自己 三 年 来 的 知识 积累 写 进 教材 中 ,这 
就 是 写作 《Web 技术 导论 (第 3 版 )》 的 初衷 。 

本 书 保留 了 第 2 版 的 结构 , 几 年 来 的 教学 实践 表明 了 这 种 结构 的 科学 性 和 合理 性 。 但 
和 第 2 版 相 比 ,本 书 在 每 一 章 的 内 容 组 织 和 结构 上 做 了 许多 调整 ,例如 ,第 1 章 增 加 了 
HTTP 的 讲解 ; 第 2 章 增 加 了 虚拟 主机 和 虚拟 目录 的 知识 ; 第 3 章 对 HTML 进行 了 进 一 
步 凝练 ,加 强 了 XML 的 讲解 ; 第 5 章 增加 了 正则 表达 式 对 象 的 介绍 ; 第 6 章 增加 了 SQL 
一 节 。 对 于 第 2 版 中 许多 陈旧 的 内 容 、 没 有 实际 应 用 的 代码 进行 了 删 减 。 
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本 书 在 例题 .习题 上 进行 了 更 加 精细 的 设计 ,全 书 共 收 集 和 讲解 了 150 多 段 非常 有 用 的 
程序 代码 ,内 容 涉 及 HTML 中 的 页 面 布局 ,CSS 和 图 层 的 设计 和 应 用 ,弹出 式 菜单 、 树 形 菜 
单 的 设计 和 不 同 的 实现 方法 ,表单 数据 的 获取 ,用 户 输入 的 有 效 性 验证 ,数据 之 间 的 类 型 转 
换 , 页 面 之 间 的 参数 传递 ,页面 安全 ,服务 端的 文件 和 文件 夹 操作 ,数据 库 的 访问 和 操作 ， 
SQL 查询 ,AJAX 异步 通信 等 各 种 实用 技术 。 

本 书 仍 分 为 6 章 , 主 要 内 容 如 下 。 

第 1 章 Web 基础 。 介 绍 Internet 的 产生 和 发 展 , 万 维 网 的 概念 .HTTP 通信 原理 以 
及 Web 应 用 的 概念 ; 介绍 Web 相关 的 核心 技术 ,包括 Java 技术 .XML 技术 、Web 服务 等 ; 
然后 介绍 计算 机 应 用 模式 C/S 架构 到 B/S 架构 的 演变 ,以 及 软件 体系 架构 和 开发 模式 的 发 
展 ,特别 是 SOA 架构 及 相关 概念 ; 最 后 对 语义 Web 等 新 进展 进行 概要 性 介绍 。 

第 2 章 Web 服务 器 的 架设 和 管理 。 介 绍 Web 服务 器 的 概念 .Web 服务 器 的 功能 。 
主要 讲解 Windows Server 2003 中 IIS 的 配置 和 管理 ,讲解 Apache 和 Tomcat 的 功能 以 及 
它们 的 关系 、Apache 和 Tomcat 的 架设 和 管理 ,讲解 虚拟 主机 和 虚拟 目录 的 概念 及 其 配置 
方法 。 

第 3 章 HTML 与 XML 基础 。 介 绍 标记 语言 的 概念 ; 然后 详细 介绍 HTML 的 语法 ， 
对 CSS 技术 、 图 层 进行 深入 讲解 ,并 安排 大 量 的 例子 解释 每 个 标记 的 含义 和 使 用 ; 然后 讲解 
XML 的 本 质 特 征 , 剖 析 了 XML 和 HTML 的 本 质 区 别 ; 介绍 XML 开发 工具 XML Spy 的 
应 用 。 

第 4 章 网 页 设计 与 制作 。 网 页 作为 Web 应 用 的 主要 用 户 界面 ,在 HTML 基础 上 ,加 
强 了 网 页 设计 的 讲解 ,包括 页 面 功能 与 内 容 设计 、 页 面 布局 设计 、 页 面 视觉 设计 以 及 页 面 效 
果 设 计 等 ; 然后 ,介绍 可 视 化 制作 工具 FrontPage 的 使 用 。 

第 5 章 客户 端 编程 。 首 先 讲解 Web 浏览 器 的 基本 工作 原理 ; 然后 讲解 客户 端 脚本 
程序 设计 语言 JavaScript .浏览 器 对 象 模型 (BOM) .HTML 文档 对 象 模 型 (DOM) 等 ; 并 讲 
解 AJAX 技术 ; 通过 四 个 综合 案例 ,详细 讲解 JavaScript 中 菜单 的 实现 、 表 单数 据 的 有 效 性 
验证 .表单 数据 的 处 理 等 问题 ,这 些 综合 案例 包含 许多 Web 开发 中 所 需要 的 代码 。 

第 6 章 服务 端 编程 。 首 先 介绍 B/S 三 层 结构 的 概念 ; 然后 简单 讲解 Java 程序 设计 
语言 基础 ,介绍 Java 技术 的 特点 、 类 与 对 象 、 接 口 \ 包 等 基本 概念 ,介绍 JavaBeans 、Servlet 
服务 器 程序 的 概念 ,这 些 概 念 是 开展 基于 Java 技术 的 服务 端 编程 的 基础 。 本 章 的 重点 是 
JSP 技术 和 数据 库 编程 。 在 JSP 技术 中 ,讲解 JSP 的 语法 JSP 中 的 数据 类 型 及 其 转换 、JSP 
内 置 对 象 JSP 中 的 参数 传递 方法 等 内 容 ; 然后 讲解 服务 端的 数据 库 编 程 以 及 SQL ,并 给 出 
两 个 综合 性 例子 ; 讲解 基于 AJAX 技术 的 在 线 聊天 Web 应 用 的 整个 开发 过 程 ; 最 后 对 常 
用 的 Java 开发 工具 进行 介绍 。 

作为 互联 网 的 用 户 和 Web 技术 的 开发 者 和 实践 者 ,同时 作为 一 个 公司 派 的 高 校 教师 ， 
笔者 希望 这 本 书 的 知识 结构 和 内 容 对 于 您 了 解 Internet 和 WWW .学习 Web 开发 .进行 
Web 编程 以 及 提高 Web 的 应 用 水 平等 能 有 所 帮助 。 也 希望 其 中 的 大 量 例 子 在 未 来 的 Web 
研发 中 ,对 编程 有 所 启发 ,节省 宝贵 的 时 间 。 软 件 开发 是 一 个 积累 的 过 程 ,让 我 们 一 起 在 这 
种 积累 中 进步 ,来 享受 成 功 的 乐趣 。 

在 本 书写 作 的 过 程 中 ,非常 感谢 我 的 同事 巩 裕 伟 、 焦 文江 、 杨 兴 强 、 韩 振 \ 阐 铮 和 李 蕴 等 
多 位 老师 的 工作 和 提出 的 良好 建议 ,还 要 感谢 我 的 学 生 苏 雪 、 常 跃 峰 、 崔 旭 、 朱 涯 、 田 容 雨 、 尤 
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凤 英 . 董 颖 、, 张 会 昌 \ 卢 艳 萍 、 田 韶 存 等 ,他 (她 ) 们 都 参与 了 我 们 许多 项 目的 研发 工作 ,编写 了 
大 量 的 程序 代码 ,祝愿 他 (她 ) 们 在 以 后 的 工作 和 生活 中 一 切 顺 利 , 祝 愿 他 们 取得 更 大 的 成 
绩 。 还 要 感谢 山东 大 学 本 科 生 院 、 山 东 大 学 研究 生 院 的 立项 支持 ,感谢 教育 部 全 国 高 校 教师 
网 培 中 心 对 本 书 的 厚爱 ,感谢 清华 大 学 出 版 社 付 弘 宇 编辑 长 期 以 来 对 本 书 的 辛勤 付出 。 

由 于 本 书 涉 及 的 内 容 非 常 广 泛 , 在 深度 和 广度 上 很 难 做 到 完美 ,同时 ,也 由 于 笔者 的 知 
识 面 和 认识 有 限 , 书 中 肯定 存在 错误 和 不 足 , 敬 请 各 位 同行 和 读者 批评 指正 。 

笔者 的 E-mail: hxw@sdu. edu. cn ,课程 网 址 : http://gsl. sdu. edu. cn/。 


郝 兴 伟 
2012 年 春 


今天 ,Internet 已 经 成 为 一 种 最 基本 的 社会 基础 设施 , 它 几 乎 渗透 到 了 现代 社会 的 每 一 
个 角落 。 无 论 是 IT 专业 人 员 、 其 他 工作 人 员 还 是 一 般 计 算 机 用 户 , 互 联网 已 经 成 为 人 们 最 
主要 的 通信 、 获 取信 息 和 发 布 信息 的 媒体 。 互 联网 应 用 的 普及 推动 了 人 们 对 学 习 和 了 解 
Internet 相关 技术 的 社会 需求 。 但 是 , 走 进 书 店 或 在 Internet 上 查询 ,关于 互联 网 的 书籍 铺 
天 盖 地 , 令 人 眼花 练 乱 。 有 关 的 书籍 太 多 ,以 至 于 我 们 无 所 适 从 。 为 此 ,我 想 编写 一 本 介绍 
互联 网 开发 和 应 用 的 综合 性 书籍 ,使 大 家 对 目前 的 互联 网 ,特别 是 Web 技术 ,从 概念 ,原理 
和 应 用 上 有 一 个 总 体 的 了 解 和 把 握 ,这 就 是 本 书 第 1 版 写作 的 初衷。 

从 2005 年 本 书 第 1 版 的 出 版 到 现在 ,三 年 过 去 了 ,《Web 技术 导论 ) 一 书 受到 了 许多 老 
师 的 认可 ,被 选 作 教科 书 。 我 也 非常 高 兴 地 收 到 了 20 多 位 任课 教师 的 邮件 ,与 我 交流 书 中 
的 相关 技术 ,有 些 老师 还 非常 诚恳 地 对 本 书 提出 了 一 些 良好 建议 ,比如 : 增加 有 关 Web 服 
务 .SOA 等 最 新 Web 概念 的 内 容 ,去 掉 操 作 性 的 多 媒体 制作 章节 ,等 等 。 这 些 良好 的 建议 
和 这 几 年 来 我 在 Web 开发 中 的 一 些 新 的 认识 和 体会 促使 自己 决定 对 第 1 版 进行 彻底 的 修 
订 , 增 加 更 多 新 技术 的 讲解 ,特别 是 Web 环境 下 的 软件 体系 结构 .开发 模式 .设计 模式 、 
AJAX 技术 等 新 的 内 容 , 从 而 使 本 书 能 够 紧 跟 互联 网 的 发 展 步伐 。 

本 书 作为 导论 性 质 的 书籍 ,将 全 面 介绍 互联 网 的 发 展 历史 、 最 新 的 科学 进展 、Web 的 工 
作 原 理 、 计 算 模式 和 软件 体系 结构 的 演变 、Web 核心 技术 、 互 联网 语言 .Web 设计 模式 、Web 
客户 端 开发 .Web 服务 端 开发 等 内 容 。 相 信 这 样 的 内 容 安排 对 大 多 数 读 者 都 会 有 所 帮助 。 
如 果 你 是 一 个 初学 者 ,这 本 书 会 为 你 答疑 解 惑 ; 如 果 你 是 一 个 初级 的 开发 人 员 ,这 本 书 可 以 
为 你 建立 一 个 Web 开发 的 基本 框架 ,引领 你 进入 Web 开发 的 广阔 天 地 ; 如 果 你 是 一 个 高 
级 开发 人 员 ,本 书 的 综合 性 内 容 也 会 为 你 阅读 其 他 专业 知识 做 一 个 基本 知识 的 铺垫 。 

本 书 与 第 1 版 一 样 ,仍然 分 成 6 章 , 主 要 内 容 如 下 。 

第 1 章 Web 基础 。 介 绍 互联 网 的 发 展 和 相关 概念 ,Web 的 工作 机 理 以 及 Java 技术 、 
XML、Web 服务 等 Web 核心 技术 ; 还 介绍 计算 机 软件 体系 架构 的 演变 和 SOA 体系 架构 的 
思想 ; 最 后 介绍 Web 2.0 和 语义 Web 的 发 展 。 

第 2 章 Web 服务 器 的 架设 和 管理 。 首 先 介绍 操作 系统 和 Web 服务 器 的 概念 ; 然后 
介绍 Windows 平台 下 的 Web 服务 器 的 架设 和 管理 ,主要 讲解 Windows Server 平台 中 的 
IIS, 对 IIS 的 讲解 比较 简单 ,易于 理解 ; 在 理解 Web 服务 的 管理 后 ,重点 讲解 Apache 
Tomcat 的 架设 和 管理 以 及 Web 应 用 的 部 署 等 ,Apache 是 开发 Web 应 用 最 常用 的 运行 平 
台 ; 最 后 对 Web 服务 器 的 远程 管理 进行 讲解 。 

第 3 章 HTML 和 XML 基础 。 首 先 介绍 标记 语言 的 概念 ,介绍 HTML 的 基本 语法 ， 
并 安排 大 量 实例 来 说 明 每 种 元 素 的 含义 和 使 用 ; 对 HTML 和 XML 的 本 质 区 别 进行 深入 
的 分 析 和 总 结 ; 讲解 XML 相关 的 规范 ,包括 可 扩展 样式 语言 (XSL)、XML 路 径 语 言 
(XPath) 、XML 查询 语言 (XQuery) 、 可 扩展 连接 语言 (XLL) 、XML 文档 对 象 模型 (DOMD 与 
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简单 应 用 程序 接口 (SAX) ,并 对 它们 之 间 的 关系 进行 总 结 ,这 些 内 容 对 大 家 理解 以 XML 为 
核心 的 Web 技术 具有 重要 意义 。 

第 4 章 网 页 设计 与 制作 。 网 页 是 Web 应 用 的 主要 用 户 界面 ,在 HTML 和 XML 基 
础 上 ,加 强 网 页 设计 的 讲解 ,包括 页 面 功能 与 内 容 设计 、 页 面 布局 设计 、 页 面 视觉 设计 以 及 页 
面 效 果 设 计 等 ; 然后 ,介绍 可 视 化 的 网 页 制作 工具 FrontPage。 

第 5 章 客户 端 开 发 。 首 先 讲解 Web 浏览 器 的 基本 工作 原理 ,然后 讲解 客户 端 脚本 程 
序 设计 语言 JavaScript 浏览 器 对 象 模 型 (BOM) HTML 文档 对 象 模型 (DOM) 、Web 交互 
的 内 容 , 增 加 AJAX 技术 的 讲解 ,最 后 详细 讲解 两 个 综合 性 客户 端 开 发 实例 。 

第 6 章 服务 端 开发 。 首 先 介绍 B/S 三 层 结构 的 概念 ; 然后 重点 讲解 Java 技术 及 其 
在 Web 开发 中 的 应 用 ,包括 Java 程序 设计 语言 ,Java Applet JavaBeans Servlet 服务 器 程 
序 、JSP 技术 以 及 MVC 设计 模式 ; 在 JSP 技术 中 ,讲解 JSP 的 语法 .内置 对 象 . 数 据 库 操 作 、 
图 形 操作 等 许多 实用 的 内 容 ; 最 后 ,讲解 在 线 聊 天 Web 应 用 的 整个 开发 过 程 ,同时 对 常用 
的 Java 开发 工具 进行 介绍 。 

作为 互联 网 的 用 户 和 Web 技术 的 开发 者 和 实践 者 ,同时 ,作为 一 名 高 校 教师 ,虽然 ,我 
的 初衷 是 使 本 书 既 包含 广泛 的 理论 知识 ,又 有 很 好 的 技术 内 容 , 但 是 要 真正 地 将 理论 和 技术 
结合 起 来 是 很 困难 的 。 一 方面 是 Web 相关 的 技术 实在 太 多 ,笔者 的 知识 面 和 认识 有 限 ,加 
之 时 间 仓 促 ; 再 者 是 考虑 到 读者 的 实际 应 用 需求 非常 多 样 ,很 想 把 一 些 更 实用 的 软件 代码 
介绍 给 大 家 ,并 进行 讲解 ,但 是 ,受到 篇 幅 的 限制 ,也 不 能 如 愿 。 

在 本 书写 作 的 过 程 中 ,我 要 感谢 我 的 同事 巩 裕 伟 教 授 ,他 是 一 名 优秀 的 老师 ,总 是 将 计 
算 机 技术 深入 浅 出 地 传授 给 学 生 , 受 到 学 生 的 普遍 欢迎 。 同 时 ,他 还 是 一 位 很 好 的 程序 员 ， 
编写 了 大 量 的 Java、JSP、Visual Basic 程序 和 数据 库 应 用 系统 。 另 外 ,他 还 是 一 位 出 色 的 作 
者 ,我 们 合作 出 版 过 许多 计算 机 方面 的 书籍 。 同 时 我 要 感谢 我 的 同事 焦 文 江 老师 ,他 对 网 络 
环境 有 着 很 深入 的 研究 ,对 网 络 设备 非常 熟悉 ,对 待 工作 总 是 认真 负责 。 还 要 感谢 我 的 学 生 
苏 雪 、 常 跃 峰 、 崔 旭 和 朱 岩 ,他 们 编写 了 大 量 的 程序 代码 ,祝愿 他 们 在 以 后 的 工作 和 生活 中 一 
切 顺利 ,祝愿 他 们 取得 更 大 的 成 绩 。 感 谢 孟 祥 旭 教授 、 王 海洋 教授 、 马 军 教授 、 张 彩 明 教授 、 
徐 秋 亮 教授 、 龙 世 立 研究 员 ,作为 领导 、 同 事 和 朋友 ,他 们 在 学 术 上 和 事业 上 都 给 了 我 很 大 的 
帮助 。 最 后 ,感谢 山东 大 学 研究 生 院 的 立项 资助 。 

由 于 本 书 涉及 的 内 容 非常 广泛 ,在 深度 和 广度 上 很 难 做 到 完美 ,加 之 作者 水 平 有 限 , 书 
中 肯定 存在 错误 和 不 足 , 敬 请 读者 批评 指正 。 

作者 E-mail: hxw@sdu. edu. cn。 


郝 兴 伟 
2008 年 暑假 


没有 哪 一 项 技术 能 和 今天 的 Internet 一 样 发 展 迅速 了 , 它 对 我 们 的 工作 .生活 的 影响 面 
之 广 .影响 程度 之 深 , 使 得 我 们 不 能 不 重视 它 。 走 进 书店 或 在 Internet 上 查询 ,关于 互联 网 
的 书籍 铺天盖地 , 令 人 眼花 练 乱 。 无 论 你 是 一 个 专业 的 开发 人 员 .普通 用 户 还 是 一 个 计算 机 
网 络 生活 的 爱好 者 ,有 关 的 书籍 太 多 了 ,以 至 于 我 们 无 所 适 从 。 

可 是 要 找到 一 本 自己 适合 的 书 却 很 难 , 也 许 你 无 法 说 清楚 你 要 的 书 是 什么 ,因为 你 对 互 
联网 的 认识 可 能 刚刚 开始 。 也 许 你 要 找 一 本 比较 全 面 的 书 , 可 是 每 一 个 内 容 都 是 一 本 很 厚 
的 专业 书籍 。 因 此 ,笔者 计划 编写 一 本 比较 全 面 的 关于 互联 网 的 书籍 , 取 名 “Web 技术 导 
论 ”。 在 这 本 书 中 ,将 介绍 互联 网 的 发 展 历史 、 最 新 的 科学 进展 、Web 的 工作 原理 、 实 现 技 
术 、 互 联网 语言 .开发 工具 ,直到 Web 应 用 的 开发 .网 络 安全 等 内 容 。 这 样 的 内 容 安排 相信 
对 大 量 的 读者 会 有 所 帮助 。 如 果 你 是 一 个 初学 者 ,这 本 书 会 为 你 答疑 解 惑 ,如 果 你 是 一 个 初 
级 的 开发 人 员 ,这 本 书 可 以 为 你 建立 一 个 基本 的 开发 框架 , 领 你 进入 网 络 开发 的 广阔 天 地 。 
如 果 你 是 一 个 高 级 开发 人 员 ,请 您 选择 其 他 更 加 有 针对 性 的 书籍 。 

本 书 共 6 章 , 第 1 章 Web 基础 ,介绍 互联 网 的 发 展 .Web 的 工作 机 理 、 相 关 概 念 、 计 算 模 
式 、Web 新 进展 等 内 容 。 

第 2 章 Web 服务 器 的 架设 和 管理 ,介绍 Web 服务 器 的 架设 和 管理 ,主要 讲解 了 
Windows 2000 Server 中 的 IIS 和 Apache Tomcat 的 架设 和 管理 过 程 和 方法 。 

第 3 章 HTML 和 XML 基础 ,介绍 了 两 种 标记 语言 的 基本 语法 ,并 安排 了 大 量 的 例子 
解释 每 种 元 素 的 含义 和 使 用 。 

第 4 章 网 页 及 多 媒体 制作 ,在 HTML 和 XML 基础 上 ,介绍 了 可 视 化 的 制作 工作 ,包括 
FrontPage 和 Dreamweaver, 同 时 讲解 了 Photoshop 图 像 处 理 技术 和 Flash 动画 制作 技术 。 

第 5 章 客户 端 开发 ,主要 介绍 了 客户 端 脚本 程序 JavaScript 浏览 器 对 象 、_Web 交互 的 
内 容 , 并 详细 讲解 了 两 个 综合 性 的 实例 。 

第 6 章 服务 端 开发 ,介绍 了 Jave 技术 、Web 三 层 体系 结构 、Servlet/JSP/EJB 服务 端 开 
发 。 比 较 了 几 种 主流 的 开发 环境 ,如 JSP、ASP 和 了 PHP 技术 ,同时 对 Java 开发 工具 进行 了 
介绍 。 

虽然 ,笔者 的 初衷 是 要 写 一 本 既 有 理论 又 含 技术 的 书籍 ,但 是 要 真正 地 将 理论 和 技术 结 
合 起 来 是 很 困难 的 。 一 方面 是 时 间 仓 促 , 另 一 方面 也 考虑 到 读者 的 实际 应 用 需求 。 很 想 把 
一 些 更 实用 的 软件 代码 介绍 给 大 家 ,并 进行 讲解 ,但 是 受到 篇 幅 的 限制 ,也 不 能 如 愿 。 

这 里 ,要 感谢 我 的 同事 巩 裕 伟 教授 ,他 总 是 将 计算 机 技术 深入 浅 出 地 传授 给 学 生 , 受 到 
学 生 的 普遍 欢迎 ;同时 ,他 还 是 一 位 很 好 的 程序 员 ,编写 了 大 量 的 Jave、JSP、Visual Basic 和 
数据 库 应 用 系统 ; 另外 ,他 还 是 一 位 出 色 的 作者 ,我 们 合作 写 过 许多 计算 机 图 书 。 同 时 ,我 
还 要 感谢 我 的 同事 焦 文江 老师 ,他 对 网 络 环境 有 着 很 深入 的 研究 ,对 网 络 设 备 非常 熟悉 ,对 
待 工作 总 是 认真 负责 。 还 要 感谢 苏 雪 女士 ,她 现在 一 家 大 型 的 网 络 公司 工 作 , 主 要 从 事 网 络 
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开发 ,我 们 一 起 合作 开发 了 许多 Web 应 用 。 还 要 感谢 刘 丰 宁 先 生 , 他 从 事 网 络 管理 和 开发 
[ 作 。 

最 后 ,就 是 要 感谢 Internet 为 我 们 提供 了 海量 的 信息 和 如 此 快速 、 便 捷 的 交流 平台 。 

由 于 本 书 涉及 的 内 容 非常 广泛 ,在 深度 和 广度 上 很 难 做 到 完美 ,加 之 作者 水 平 有 限 , 书 
中 肯定 存在 错误 和 不 足 , 请 读者 批评 指正 。 

作者 的 E-mail 为 hxw@sdu. edu. cn 。 


郝 兴 伟 
2004 年 夏 
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【本 章 导读 】 

今天 ,互联 网 就 像 空气 一 样 正在 渗入 到 人 们 生活 的 每 一 个 角落 , 它 不 断 地 改变 着 人 们 的 
工作 、 生 活 和 娱乐 方式 ,通过 Internet, 人 们 可 以 上 网 浏览 网 页 收发 电子 邮件 、 上 网 聊天 、 观 
看 在 线 电 影 \ 网 上 购物 以 及 从 事 各 种 电子 商务 活动 ; 同时 , 随 着 B/S 应 用 模式 的 发 展 ,互联 
网 技术 也 彻底 改变 了 人 们 传统 的 计算 机 应 用 和 开发 模式 ,使 企业 、 政 府 机 构 传 统 的 计算 机 应 
用 系统 部 署 到 互联 网 上 ,彻底 改变 着 人 们 的 工作 方式 。 

本 章 首先 介绍 互联 网 和 万 维 网 的 概念 ,讲解 万 维 网 (WWW) 中 Web 服务 器 、Web 客户 
机 的 概念 ; 讲解 HTTP 以 及 Web 服务 器 和 Web 客户 机 的 通信 原理 , 它 是 万 维 网 工作 的 基 
础 ,也 是 进行 Web 服务 器 配置 、 学 习 HTML 标记 语言 .进行 Web 系统 开发 的 概念 基础 。 然 
后 ,对 万 维 网 中 的 常用 概念 进行 介绍 ; 同时 还 简要 介绍 Internet 中 的 核心 技术 ; 最 后 对 
Web 的 发 展 趋势 ,计算 机 应 用 模式 的 发 展 .SOA 计算 机 开发 模式 进行 介绍 。 

【知识 要 点 】 

1. 1 节 : Internet 的 概念 ,发 展 阶 段 。 

1.2 节 : 万 维 网 的 概念 .万维网 的 组 成 .Web 服务 器 、Web 浏览 器 .HTTP。 

1.3 节 : 网 站 .Web 应 用 、 超 文本 、 超 链接 、 统 一 资源 定位 地 址 、 端 口 Web 2. 0 博客、 微 
博 、RSS 订阅 。 

1.4 节 : Java 技术 、XML 技术 、Web 服务 。 

1.5 节 : 集中 式 计算 .C/S 计 算 机 应 用 模式 .B/S 计算 机 应 用 模式 、 公 共 对 象 请求 代 理 体 
系 结构 组件 对 象 模型 .分 布 式 组 件 对 象 模型 .面向 服务 体系 架构 .语义 Web。 


BI Internet 的 产生 与 发 展 


1946 年 ,第 一 台电 子 计算 机 “ 爱 尼 亚 克 ”(ENIAC) 在 美国 宾夕法尼亚 大 学 莫 尔 电子 工程 
学 院 诞生 。 这 种 计算 技术 的 革命 , 透 出 了 数字 信息 时 代 的 第 一 缕 曙 光 。 随 后 , 微 电 子 技术 和 
计算 机 技术 的 发 展 日 新 月 异 ,计算 机 应 用 日 益 广 泛 。 为 了 进一步 提高 计算 机 的 使 用 效率 ,人 
们 需要 将 不 同 的 计算 机 连接 起 来 ,传递 数据 ,共享 资源 ,计算 机 网 络 诞生 了 。 

20 世纪 60 年 代 , 出 现 了 各 式 各 样 的 计算 机 网 络 ,来 解决 计算 机 之 间 的 通信 和 资源 共享 
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问题 。1969 年 ,美国 国防 部 高 级 研究 计划 署 (Advanced Research Project Agency, ARPA)? 
资助 了 一 个 有 关 广 域 网 络 的 项 目 . 开 发 了 一 个 称 做 阿 帕 网 (ARPAnet) 的 网 络 , 它 的 主要 思 
想 是 构建 一 个 没有 中 央 控 制 节点 的 计算 机 网 络 , 以 便 使 军事 计算 机 系统 在 受到 打击 后 不 会 
因为 部 分 毁坏 而 导致 整个 计算 机 网 络 的 瘫痪 。 

1969 年 11 月 21 日 中 午 ,6 名 科学 家 聚会 于 美国 加 利 福 尼 亚 大 学 洛杉矶 分 校 的 计算 机 
实验 室 , 观 看 这 里 的 一 台 计 算 机 与 远 在 千里 之 外 斯 坦 福 研究 所 的 另 一 台 计 算 机 联通 。 这 是 
一 个 历史 性 的 时 刻 , 正 像 20 年 后 (时 代 》 周 刊 的 评论 : 这 些 研究 者 根本 没有 想到 ,他 们 不 只 
是 连接 了 两 台 计算 机 ,而 是 宣告 了 网 络 世界 的 到 来 。 

1970 年 ,ARPAnet 已 初 具 雏 形 ,已 经 将 加 利 福 尼 亚 州 大 学 洛杉矶 分 校 . 加 州 大 学 圣 巴 
巴 拉 分 校 、. 斯 坦 福 大 学 、 犹 他 州 大 学 四 所 大 学 的 4 台 计 算 机 以 分 组 交换 协议 连接 起 来 ,实现 
了 不 同型 号 ,不同 操 作 系统 ,不同 数据 格式 不同 终 端的 计算 机 之 间 的 通信 和 资源 共享 。 

1972 年 ,ARPAnet 已 建成 40 多 个 网 点 ,开发 出 了 三 项 主要 功能 , 即 以 后 被 广泛 使 用 的 
电子 邮件 .远程 登录 和 文件 传输 。1974 年 ,著名 的 TCP/IP 研究 成 功 ,彻底 解决 了 不 同 计算 
机 系统 之 间 的 通信 问题 ,计算 机 互联 的 主要 障碍 被 克服 。 

1975 年 ,ARPAnet 的 运行 管理 移交 给 美国 国防 通信 局 (DCA)。1982 年 DCA 将 
ARPAnet 各 站 点 的 通信 协议 全 部 转 为 TCP/IP, 同 时 ARPAnet 被 分 成 两 部 分 ,一 部 分 作为 
军用 , 称 为 MILnet, 另 一 部 分 作为 民用 。 从 此 ,ARPAnet 从 一 个 实验 型 网 络 向 实用 型 网 络 
转变 ,成 为 全 球 Internet 正式 诞生 的 标志 。 

如 果 把 Internet 的 发 展 划分 阶段 的 话 ,那么 1969 一 1984 年 可 以 看 成 Internet 的 提出 、 
研究 和 试验 阶段 ,这 时 的 Internet 以 ARPAnet 为 主干 网 。 由 于 ARPAnet 采用 离散 结构 ， 
不 设 中央 网 络 控制 设备 ,实现 了 网 络 渠 道 的 多 样 性 ,从 而 减少 了 系统 彻底 崩溃 的 可 能 性 ,网 
络 的 生存 能 力 得 到 了 保证 ,实现 了 ARPA 的 最 初 构想 。 

后 来 ,Internet 的 发 展 超出 了 任何 人 的 想象 。1984 一 1992 年 可 以 看 做 Internet 的 实用 
发 展 阶段 。 为 了 使 全 美国 的 科学 家 和 工程 师 能 够 共享 那些 过 去 只 有 军事 部 门 和 少数 科学 家 
才能 够 使 用 的 超级 计算 机 设施 ,美国 国家 科学 基金 会 (National Science Foundation ,NSF) 
于 1985 年 提供 巨 资 建设 了 全 美 5 个 超级 计算 中 心 , 同 时 建设 了 将 这 些 超 级 计算 中 心 和 各 科 
研 机 构 相 连 的 高 速 信息 网 络 NSFnet。1986 年 ,NSFnet 成 功 地 成 为 Internet 的 第 二 个 骨干 
网 。NSFnet 对 Internet 的 推广 起 到 了 巨大 的 推动 作用 , 它 使 得 Internet 不 再 是 仅 由 科学 
家 工程师 ,政府 部 门 使 用 的 网 络 ,Internet 进入 了 以 资源 共享 为 中 心 的 实用 服务 阶段 。 以 
连接 NSFnet 的 局 域 网 数量 为 例 ,1988 年 7 月 只 有 170 个 ; 到 1992 年 1 月 ,这 一 数量 就 发 
展 到 了 4500 个 。 

1992 年 以 后 ,Internet 开始 进入 它 的 商业 化 发 展 阶段 , Internet 用 户 开始 向 全 世界 扩 
展 , 并 以 每 月 15% 的 速度 迅速 增长 ,每 30 分 钟 就 有 一 个 网 络 联 入 Internet。 随 着 网 上 通信 
量 的 急剧 增长 ,Internet 开始 不 断 采 用 新 的 技术 以 适应 发 展 的 需求 ,其 主干 网 由 政府 部 门 资 
助 开始 向 商业 计算 机 公司 、 通 信 公 司 转化 。 


@ 美国 国防 部 高 级 研究 计划 署 (ARPA) 成 立 于 1958 年 2 月 ,又 称 DARPA(Defence ARPA) , 它 是 在 1957 年 苏联 
发 射 世界 第 一 颗 人 造 卫 星 Sputnik 的 背景 下 诞生 的 ,其 目标 就 是 负责 前 瞻 性 科研 项 目的 开发 ,以 确保 美国 在 诸多 技术 领 
域 的 绝对 领先 。 


第 1 章 Web 基础 


在 Internet 商业 化 的 过 程 中 ,万 维 网 的 出 现 使 Internet 的 使 用 更 简单 、 更 方 使 ,开创 了 
Internet 发 展 的 新 时 期 。1989 年 ,在 瑞士 日 内 瓦 粒子 物理 研究 实验 室 欧洲 核子 研究 中 心 
(CERN) 工 作 的 蒂 姆 。 伯 纳 斯 - 李 (Tim Berners-Lee) 首 先 提 出 了 WWW 的 概念 ,并 且 成 功 
地 开发 出 世界 上 第 一 个 万 维 网 服务 器 和 第 一 个 万 维 网 客户 机 。 同 年 底 , 带 姆 为 他 的 发 明正 
式 定 名 为 World Wide Web( 万 维 网 ); 1991 年 5 月, 万维网 在 Internet 上 首次 露面 ,立即 引 
起 郁 动 ,迅速 被 广泛 推广 应 用 。 

美国 著名 信息 专家 《数字 化 生存 (Bing Digital)》 一 书 的 作者 尼 古 拉 。 尼 葛 洛 庞 帝 
(Nicholas Negroponte) 教 授 认 为 : 1989 年 是 互联 网 历史 上 划时代 的 分 水 岭 , 这 一 年 出 现 的 
万 维 网 技术 给 Internet 赋予 了 强大 的 生命 力 ,把 Internet 带 入 了 一 个 魏 新 的 时 代 。 

在 WWW 的 发 展 中 ,还 有 一 位 杰出 的 人 物 , 他 就 是 马克 。 安 德 森 (Marc Andreessen ) ， 
是 他 改造 了 Internet 的 使 用 界面 。 在 早期 ,万 维 网 只 有 文字 ,没有 图 像 、 声 音 , 也 没有 色彩 。 
对 普通 用 户 来 说 , 仍 缺 乏 一 种 简单 的 使 用 界面 。 安 德 森 在 就 读 伊利 诺 斯 大 学 时 ,开始 在 学 校 
里 的 国家 超级 计算 中 心 C(NCSA) 兼 职工 作 ,由 于 感觉 Internet 界面 的 难于 使 用 ,他 和 同事 贝 
纳 一 起 合作 ,经 过 6 个 星期 的 辛苦 工作 ,在 1993 年 1 月 写 出 了 UNIX 版 的 马赛 克 (Mosaic) 
浏览 器 。1994 年 4 月 ,只 有 24 岁 的 安德森 , 同 硅谷 风险 投资 家 吉姆 ， 克 拉克 一 起 创立 了 
Mosaic 通讯 公司 ,集中 全 力 开 发 网 络 浏览 器 。Mosaic 通讯 公司 后 更 名 为 网 景 公司 ,1995 年 
上 市 ,1998 年 11 月 24 日 被 世界 最 大 的 Internet 服务 提供 商 美 国 在 线 (AOL) 收 购 。 


(二 Web 及 其 工作 原理 


在 Internet 中 ,Web 服务 是 最 主要 的 服务 之 一 ,也 是 使 用 最 广泛 的 Internet 服务 ,对 于 
普通 的 用 户 来 讲 , World Wide Web 就 是 互联 网 的 代名词 。 但 是 ,从 原理 上 来 讲 , World 
Wide Web 和 Internet 是 两 个 不 同 的 概念 ,两 者 既 有 密切 的 联系 ,又 有 着 根本 的 不 同 。 


1.2.1 什么 是 World Wide Web 


1990 年 ,瑞士 日 内 瓦 世 界 上 最 大 的 粒子 物理 研究 实验 室 欧洲 核子 研究 中 心 (the 
European Organization for Nuclear Research.CERN) 提 出 了 World Wide Web(WWW) 的 
概念 , 它 是 Internet 技术 、 超 文本 技术 和 多 媒体 技术 相 结 合 的 产物 。 当 时 , 核 物 理 的 研究 是 
分 散在 不 同 国家 进行 的 ,各 地 的 研究 人 员 通 过 计算 机 网 络 和 Internet 进行 学 术 交 流 。 在 
Internet 中 进行 信息 交流 还 没有 一 种 统一 的 手段 ,因此 ,根据 交流 的 信息 不 同 ( 如 图 片 文字 
等 ) 需 要 调用 不 同 的 Internet 服务 ,很 不 方便 。1989 年 3 月 ,CERN 的 带 姆 . 伯 纳 斯 - 李 开 发 
了 一 个 超级 文本 系统 ; 1990 年 底 ,第 一 个 基于 字符 界面 的 Web 客户 浏览 程序 开发 成 功 ; 
1991 年 3 月 ,客户 浏览 程序 开始 在 Internet 上 运行 ; 1991 年 底 CERN 向 高 能 物理 学 界 宣布 
了 Web 服务 。 

什么 是 World Wide Web 呢 ? 从 万 维 网 诞生 起 ,人 们 并 没有 给 它 一 个 确切 的 定义 。 可 
以 从 Internet 的 构成 和 服务 来 理解 Web。 从 组 成 上 讲 ,Internet 是 由 成 千 上 万 的 网 络 通过 
通信 线路 和 网 络 设备 连接 而 成 的 ,或 者 说 是 一 个 全 球 范围 的 网 间 网 。 在 Internet 中 ,分 布 了 
成 千 上 万 的 计算 机 ,这 些 计算 机 扮演 的 角色 和 所 起 的 作用 不 同 。 有 的 计算 机 可 以 收发 用 户 
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的 电子 邮件 ,有 的 可 以 为 用 户 传输 文件 ,有 的 负责 对 域名 进行 解析 ,更 多 的 机 器 则 用 于 组 织 
并 展示 本 网 络 的 信息 资源 ,方便 用 户 的 获取 。 所 有 这 些 承 担 服务 任务 的 计算 机 统称 为 服务 
器 。 根 据 服务 的 内 容 , 这 些 服务 有 Web 服务 器 ,文件 传 输 服务 器 (FTP 服务 器 )、E-mail 服 
务 器 .DNS 服务 器 以 及 各 种 应 用 服务 器 等 。 

所 谓 Web 服务 器 ,就 是 将 本 地 的 信息 用 超级 文本 组 织 , 向 用 户 提供 在 Internet 上 进行 
信息 浏览 服务 的 计算 机 。 因 此 ,可 以 将 World Wide Web 看 做 Internet 中 所 有 的 Web 服务 
器 构成 的 网 络 ,通过 网 页 中 的 超 链 接 , 一 个 Web 服务 器 可 以 指向 其 他 的 Web 服务 器 ,那些 
Web 服务 器 又 可 以 指向 更 多 的 Web 服务 器 ,这 样 一 个 全 球 范 围 的 由 Web 服务 器 组 成 的 
World Wide Web( 万 维 网 ) 就 形成 了 。 


1.2.2 Web 服务 器 


在 计算 机 网 络 中 ,可 以 将 计算 机 分 为 两 类 , 即 服务 器 和 客户 机 。 所 谓 服务 器 就 是 指 提供 
网 络 服务 的 计算 机 。 对 于 服务 器 计算 机 一 般 需 要 安装 服务 器 操作 系统 ,例如 UNIX、 
Windows Server 2003、Linux 等 网 络 操作 系统 。 在 服务 器 上 ,根据 功能 需要 安装 服务 器 程 
序 。 所 谓 服务 器 程序 , 即 一 种 侦 听 程序 ,其 基本 功能 是 侦 听 用 户 请 求 , 为 用 户 提 供 服务 。 与 
传统 的 用 户 应 用 程序 不 同 , 服 务 器 程序 通常 没有 潭 亮 的 用 户 界面 。 常 见 的 服务 器 有 Web 服 
务 器 、FTP 服务 器 、E-mail 服务 器 、DNS 服务 器 、DHCP 服务 器 、 终 端 服务 器 等 。 一 台 服 务 
器 计算 机 可 以 安装 一 个 服务 器 程序 .也 可 以 安装 多 个 服务 器 程序 。 

客户 机 是 指 普 通 的 用 户 计 算 机 ,通常 不 以 提供 网 络 服务 为 目的 ,安装 的 操作 系统 是 
Windows XP 等 客户 机 操作 系统 。 客 户 机 上 安装 的 程序 也 是 各 种 应 用 软件 ,例如 Word、 
Excel、PowerPoint 等 各 种 办 公 软 件 ,Photoshop、Flash 等 各 种 工具 软件 ,上 网 用 的 Web 浏 
览 器 .MSN QQ 等 应 用 软件 。 可 见 , 服 务 器 和 客户 机 的 区 分 不 仅 是 操作 系统 不 同 ,安装 的 
程序 也 不 相同 ,服务 器 上 要 安装 服务 程序 ,客户 机 上 则 安装 应 用 软件 。 同 时 ,要 使 用 服务 器 
上 的 服务 程序 ,需要 客户 机 上 安装 相应 的 客户 端 程序 或 做 客户 端的 配置 。 例 如 , Web 浏览 
器 是 Web 服务 器 的 客户 端 程序 ,通过 TCP/IP 设置 .可 以 将 一 台 计 算 机 设置 为 DNS 客户 或 
DHCP 客户 等 。 

所 谓 Web 服务 器 ,就 是 安装 了 Web 服务 器 的 计算 机 , 它 为 用 户 提供 网 页 浏览 服务 。 简 
单 地 讲 , 用 户 通过 Web 浏览 器 访问 Web 服务 器 ,Web 服务 器 将 用 户 要 浏览 的 网 页 发 送 给 用 
户 的 浏览 器 。 要 使 一 台 计 算 机 成 为 一 台 Web 服务 器 .首先 要 在 服务 器 上 安装 服务 器 操作 系 
统 ,例如 UNIX、Windows Server 2003、Linux 等 ; 其 次 ,安装 专门 的 Web 服务 程序 ,如 
Windows Server 内 置 的 IIS(Internet Information Server) 服 务 组 件 、.Apache/Tomcat 等 。 
关于 Web 服务 器 的 安装 和 配置 ,参见 第 2 章 。 


1.2.3 ”Web 浏览 器 


在 计算 机 网 络 中 ,服务 器 和 客户 总 是 成 对 出 现 的 ,用 户 通 过 客户 端 程序 使 用 服务 器 ,或 
者 通过 特定 的 设置 将 计算 机 设置 为 特定 服务 的 客户 机 。 所 谓 Web 浏览 器 (Browser) 就 是 前 
面 经 常 提 到 的 Web 客户 端 程序 ,用 户 要 浏览 Web 页 面 必须 在 本 地 计算 机 上 安装 Web 浏览 
器 软件 。 通 过 在 浏览 器 地 址 栏 中 输入 URL 资源 地 址 , Web 服务 器 将 把 地 址 中 指定 的 网 页 
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文件 发 送 到 客户 端 浏览 器 ,并 在 浏览 器 窗口 中 打开 。 

从 本 质 上 讲 ,Web 浏览 器 是 一 种 用 于 网 页 浏览 的 应 用 软件 ,有 两 大 功能 : 第 一 , Web 浏 
览 器 是 HTML 和 XML 格式 的 文档 阅读 器 , 它 能 够 对 网 页 中 的 各 种 标记 进行 解释 显示 ; 第 
二 ,浏览 器 是 一 种 网 页 客户 端 程序 的 解释 机 ,如 果 网 页 中 包含 客户 端 脚本 程序 ,浏览 器 将 执 
行 这 些 客 户 端 脚本 代码 ,从 而 增强 网 页 的 交互 性 和 动态 效果 。 不 同 版 本 的 浏览 器 都 需要 遵 
循 HTML 规范 中 定义 的 标记 集 , 同 时 为 了 便于 脚本 编程 ,每 个 浏览 器 程序 本 身 也 提供 了 相 
应 的 浏览 器 内 置 对 象 ,类 似 于 传统 软件 开发 中 的 函数 库 及 其 标准 库 函 数 。 

在 Web 发 展 初 期 ,浏览 器 程序 主要 分 成 两 类 。 一 类 为 以 Lynx 为 代表 的 基于 字符 的 
Web 客户 机 程序 ,主要 在 不 具备 图 形 图 像 功能 的 计算 机 上 使 用 。Lynx 是 由 美国 堪萨斯 大 
学 的 Lou Montulli 等 研制 的 。Lynx 操作 通过 光标 键 在 页 面 的 超 链接 间 移 动 ,类 似 于 搜索 
引擎 ,因此 ,目前 Lynx 常用 于 检查 网 站 。 另 一 类 是 以 Mosaic 为 代表 的 面向 多 媒体 计算 机 
的 Web 客户 机 程序 , 它 可 以 在 各 种 类 型 的 小 型 机 上 运行 ,也 可 以 在 IBM PC、Macintosh 机 
以 及 UNIX 操作 系统 软件 平台 上 运行 。 目 前 ,Web 浏览 器 软件 产品 很 多 ,除了 微软 的 IE 
(Internet Explorer) 浏 览 器 外 ,常见 的 浏览 器 有 Maxthon (傲游 )、Firefox( 火 狐狸 )、Opera 
等 。 此 外 ,Google、360 安全 卫士 等 也 分 别 推出 了 自己 的 Web 浏览 器 产品 。 


1.2.4 HTTP 概述 


在 万 维 网 中 ,网 页 浏览 实际 上 就 是 Web 浏览 器 和 Web 服务 器 之 间 通 信 的 过 程 。Web 
浏览 器 和 Web 服务 器 之 间 通 过 HTTP 进行 通信 ,概念 模型 如 图 1-1 所 示 。 
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1-1 Web 的 工作 原理 


1 HTTP 


在 Internet 中 , 超 文 本 传送 协议 (Hyper Text Transfer Protocol, HTTP) 是 应 用 层 协 
议 ,采用 请 求 /响应 模型 。 当 在 浏览 器 中 输入 URL 或 单 击 页 面 中 的 一 个 超级 链接 时 ,浏览 
器 就 向 Web 服务 器 发 送 HTTP 请 求 (HTTP Request)。HTTP 请 求 被 送 往 URL 指定 的 
Web 服务 器 , Web 服务 器 的 HTTP 驻 留 程序 接收 到 请 求 后 ,进行 必要 的 操作 ,返回 HTTP 
响应 (HTTP Response) 给 Web 浏览 器 。 
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在 HTTP 通信 中 ,HTTP 消息 包括 客户 机 向 服务 器 的 请 求 消息 和 服务 器 向 客户 机 的 
响应 消息 。HTTP 消息 由 一 个 起 始 行 、 一 个 或 者 多 个 头 域 以 及 消息 体 ( 可 选 ) 组 成 。HTTP 
头 域 是 HTTP 请 求 和 响应 的 核心 部 分 .它们 携带 关于 客户 端 浏览 器 、 被 请 求 页 面 、. 服 务 器 及 
其 他 信息 。HTTP 头 域 包括 通 用 头 域 .请 求 头 域 , 响 应 头 域 和 实体 4 个 部 分 。 每 个 头 域 由 
一 个 域名 .冒号 (:) 和 域 值 三 部 分 组 成 ,域名 大 小 写 无 关 , 每 个 头 域 占 一 行 。 

(1) 通用 头 域 : 包含 请 求 和 响应 消息 都 支持 的 头 域 。 通 用 头 域 包 含 Cache-Control、 
Connection、Date、Pragma、Transfer-Encoding、Upgrade、Via。 关 于 各 个 头 域 的 含义 及 取 值 
请 参考 HTTP 规范 ,以 下 同 。 

(2) 请 求 头 域 : 允许 客户 端 向 服务 器 传递 关于 请 求 或 者 关于 客户 机 的 附加 信息 。 请 求 头 
域 包 含 下 列 字 段 : Accept、 Accept-Charset、 Accept-Encoding、Accept-Language、 Authorization、 
From, Host, If-Modified-Since,\ If-Match INone-Match IfRange If-Range, If-Unmodified-Since、 
Max-Forwards .Proxy-Authorization ,Range, Referer .User-Agent, 

(3) 响应 头 域 : 允许 服务 器 传递 不 能 放 在 状态 行 的 附加 信息 ,这 些 域 主要 描述 服务 器 
的 信息 和 Request-URI 进一步 的 信息 。 响 应 头 域 包含 Age、Location、Proxy-Authenticate、 
Public, Retry-After,Server .Vary .Warning WW W-Authenticate。 

(4) 实体 : 请 求 消息 和 响应 消息 都 可 以 包含 实体 ,实体 一 般 由 实体 头 (Entity Header) 
和 实体 (Entity Body) 组 成 。 实 体 头 包含 关于 实体 的 元 信息 ,实体 头 包含 Allow、Content- 
Base、Content-Encoding、Content-Language、Content-Length、Content-Location 、Content- 
MD5、 Content-Range、 Content-Type、Expires、Last-Modified 及 extension-header。 
extension-header 机 制 允 许 客户 端 定义 新 的 实体 头 ,但 是 这 些 域 可 能 无 法 被 接收 方 识别 。 实 
体 可 以 是 一 个 经 过 编码 的 字 节 流 , 它 的 编码 方式 由 Content-Encoding 或 Content-Type 定 
义 , 它 的 长 度 由 Content-Length 或 Content-Range 定义 。 在 通信 过 程 中 ,如 果 存 在 不 支持 的 
通用 头 域 , 一 般 将 会 作为 实体 头 域 处 理 。 


2. 请 求 消息 


当 用 户 在 浏览 器 地 址 栏 中 输入 一 个 URL 或 单 击 页 面 中 的 超 链 接 时 ,浏览 器 向 Web 服 
务 器 发 送 HTTP 请 求 消息 。HTTP 请 求 消息 由 两 部 分 构成 ,第 一 行为 Request Line, 后 面 
的 部 分 为 HTTP 头 。 其 中 ,Request Line 由 三 部 分 组 成 ,一 般 格式 如 下 : 


Method Request - URI HTTP - Version 


(1) Method: 表示 对 于 Request-URI 完成 的 方法 ,这 个 字段 是 大 小 写 敏感 的 ,包括 
GET、POST、OPTIONS、HEAD、PUT、DELETE、TRACE。 其 中 GET 和 POST 方法 使 用 
较 多 ,用 于 编码 和 传送 变量 名 /变量 值 对 参数 ,两 者 主要 具有 如 下 区 别 。Q@GET 方法 使 用 
MIME 类 型 文本 的 格式 传递 参数 ,附加 参数 还 能 被 认为 是 一 个 查询 字符 串 。 在 客户 端 ， 
GET 方式 通过 URL 提交 数据 .数据 在 URL 中 可 以 看 到 ,GET 方法 提交 的 数据 最 多 只 能 有 
1024B。@POST 方法 参数 同样 被 URL 编码 ,但 是 ,变量 名 /变量 值 不 作为 URL 的 一 部 分 
被 传送 ,而 是 放 在 HTTP 请 求 消息 内 部 被 传送 ; POST 方法 提交 的 数据 多 少 没 有 限制 , 通 
常用 于 提交 表单 数据 , 即 在 一 form> 标 记 中 设置 method 二 "POST"。 
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(2) Request-URI: 遵循 URI 格式 ,在 此 字段 为 星 号 (x* ) 时 ,说 明 请 求 并 不 用 于 某 个 特 
定 的 资源 地 址 ,而 是 用 于 服务 器 本 身 。 

(3) HTTP-Version: 表示 支持 的 HTTP 版 本 ,例如 HTTP/1. 1。 

在 Request Line 的 后 面 是 HTTP 头 域 ,请 求 头 域 允 许 客户 端 向 服务 器 传递 关于 请 求 或 
者 关于 客户 机 的 附加 信息 。 

一 个 典型 的 HTTP 请 求 消息 如 下 : 


GET /2010/xxjj. html HTTP/1.1 

Host :www. sdu. edu. cn 

User - Agent :Mozilla/5.0 (Windows NT 5.1: rv:10.0.2) Gecko/20100101 Firefox/10.0.2 

Accept: text/html,application/xhtml + xml,application/xml;q= 0.9, */* ;q=0.8 

Accept — Language:zh— cn,zh:q=0.5 

Accept — Encoding:gzip, deflate 

Connection: keep -alive 

Referer: http://www. sdu. edu. cn/ 

Cookie: lzstat _ uv = 2061275203206613369 | 2684626; lzstat _ ss = 1170560923 _0 _ 1331481597 
2684626 


上 例 第 一 行 表 示 HTTP 客户 端 通过 GET 方法 获得 指定 URL 下 的 文件 。 通 过 下 面 的 
Referer 可 以 得 到 完整 的 URL 为 http://www. sdu. edu. cn/2010/xxjjhtm。 该 HTTP 请 求 
的 头 域 设置 解释 如 下 。 

(1) Host: Host 头 域 指定 请 求 资源 的 主机 和 端口 号 ,表示 请 求 URL 的 原始 服务 器 或 
网 关 的 位 置 。HTTP/1. 1 请 求 必须 包含 主机 头 域 ,否则 系统 会 以 400 状态 码 返 回 。 

(2) User-Agent: User-Agent 头 域 包含 发 出 请 求 的 用 户 信息 。 

(3) Accept: 告诉 Web 服务 器 浏览 器 可 以 接收 的 介质 类 型 , */* 表示 任何 类 型 ， 
type/ * 表示 该 类 型 下 的 所 有 子 类 型 (type/sub-type)。 

(4) Accept-Language: 浏览 器 声明 自己 接收 的 语言 。 

(5) Connection 请 求 : 如 果 取 值 为 close, 则 告知 Web 服务 器 或 者 代理 服务 器 ,在 完成 
本 次 请 求 的 响应 后 , 断 开 连接 ,不 要 等 待 本 次 连接 的 后 续 请 求 了 ; 如 果 取 值 为 keepalive, 则 
告知 Web 服务 器 或 者 代理 服务 器 ,在 完成 本 次 请 求 的 响应 后 ,保持 连接 ,等 待 本 次 连接 的 后 

(6) Referer 头 域 : Referer 头 域 允 许 客户 端 指定 请 求 URL 的 源 资源 地 址 ,这 可 以 允许 
服务 器 生成 回 退 链 表 ,可 用 来 登录 .优化 Cache 等 。 它 也 允许 废除 的 或 错误 的 连接 由 于 维护 
的 目的 被 追踪 。 如 果 请 求 的 URL 没有 自己 的 URL 地 址 ,Referer 不 能 被 发 送 。 如 果 指 定 
的 是 部 分 URL 地 址 , 则 此 地 址 应 该 是 一 个 相对 地 址 。 


3. 响应 消息 
HTTP 响应 消息 由 状态 行 、 头 域 和 内 容 组 成 。 响 应 消息 的 第 一 行为 状态 行 ,格式 为 : 
HTTP - Version Status - Code Reason - Phrase 


其 中 ,HTTP-Version 表示 支持 的 HTTP 版 本 ,例如 为 HTTP/1. 1; Status-Code 是 一 
个 三 个 数字 的 结果 代码 ,用 于 机 器 自动 识别 ; Reason-Phrase 给 Status-Code 提供 一 个 简单 
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的 文本 描述 ,用 于 帮助 用 户 理解 。 

Status-Code 编码 由 三 个 数字 组 成 ,第 一 个 数字 定义 响应 的 类 别 , 后 两 个 数字 没有 分 类 
的 作用 。 常 见 的 状态 码 分 为 五 种 。Q1xx: 信息 响应 类 ,表示 接收 到 请 求 并 且 继续 处 理 。 
@2xx: 处 理 成 功 响应 类 ,表示 动作 被 成 功 接收 理解 和 接受 。@3xx: 重 定向 响应 类 ,为 了 
完成 指定 的 动作 ,必须 接受 进一步 处 理 。@4xx: 客户 端 错误 ,客户 请 求 包含 语 法 错误 或 者 
是 不 能 正确 执行 。@5xx: 服务 端 错误 ,服务 器 不 能 正确 执行 一 个 正确 的 请 求 。 

在 状态 行 的 后 面 是 响应 头 域 ,响应 头 域 允许 服务 器 传递 不 能 放 在 状态 行 的 附加 信息 ,这 
些 域 主要 描述 服务 器 的 信息 和 Request-URI 进一步 的 信息 。 如 果 存 在 不 支持 的 响应 头 域 ， 
一 般 将 会 作为 实体 头 域 处 理 。 

对 于 上 面 的 HTTP 请 求 ,返回 的 一 个 典型 的 HTTP 响应 消息 如 下 : 


HTTP/1. 1 304 Not Modified 

Date: Sun, 11 Mar 2012 08:28:32 GMT 

Server: Apache/2.2.17(UNIX) 

Connection: Keep— Alive 

Keep— Alive: timeout = 5,max= 100 

Etag:"1684db— 1536 — 4ba3ce4300900" 

上 例 第 一 行 表示 HTTP 服务 端 响应 一 个 GET 方法 。 下 面 是 头 域 ,解释 如 下 。 

(1) Server: Server 响应 头 域 包含 处 理 请 求 的 原始 服务 器 的 软件 信息 。 此 域 包含 多 个 
产品 标识 和 注释 ,产品 标识 一 般 按 照 重要 性 排序 。 

(2) Connection 响应 : 和 Connection 请 求 对 应 。 如 果 取 值 为 close, 则 表明 连接 已 经 关 
闭 。 如 果 取 值 为 keepalive, 则 表明 连接 保持 着 ,在 等 待 本 次 连接 的 后 续 请 求 。 

(3) Keep-Alive: 如 果 浏 览 器 请 求 保持 连接 ,该 头 部 表明 Web 服务 器 保持 连接 的 时 间 
( 秒 ) 。 

(4) Etag: 一 个 URL 对 象 的 标识 ,作用 与 Last-Modified 类 似 ,主要 供 Web 服务 器 判 
断 一 个 对 象 是 否 改变 。 例 如 ,前 一 次 请 求 某 个 html 文件 时 ,获得 其 Etag, 当 再 次 请 求 同 一 
个 文件 时 ,浏览 器 就 会 把 先前 获得 的 Etag 值 发 送 给 Web 服务 器 ,然后 Web 服务 器 会 把 这 
个 Etag 跟 该 文件 的 当前 Etag 进行 对 比 ,以 判断 文件 是 否 已 经 改变 。 


4. 实体 


HTTP 请 求 消息 和 HTTP 响应 消息 都 可 以 包含 实体 信息 ,实体 信息 一 般 由 实体 头 和 
实体 组 成 。 实 体 可 以 是 一 个 经 过 编码 的 字 节 流 , 它 的 编码 方式 由 Content-Encoding 或 
Content-Type 定义 , 它 的 长 度 由 Content-Length 或 Content-Range 定义 。extension-header 
允许 客户 端 定义 新 的 实体 头 , 但 是 这 些 域 可 能 无 法 被 接收 方 识别 。 

在 HTTP 规范 中 ,获取 HTTP 通信 信息 ,可 以 分 析 Web 服务 器 和 Web 浏览 器 的 配置 。 
在 Firefox 浏览 器 中 ,可 以 安装 LiveHTTPHeaders 插件 来 抓 取 http, 插 件 的 下 载 网 址 为 
http://livehttpheaders. mozdev. org/installation. html。 下 载 该 插件 ,安装 Firefox 浏览 器 ， 
选择 “工具 ”一 “附加 组 件 ” 命 令 , 安 装 LiveHTTPHeaders 插件 , 则 在 “工具 ”菜单 中 添加 
LiveHTTPHeaders 命令 ,执行 该 命令 打开 抓 包 窗 口 , 然 后 在 地 址 栏 中 输入 一 个 网 址 , 则 在 
LiveHTTPHeaders 窗口 可 看 到 每 个 URL 链接 的 HTTP 请 求 和 响应 消息 。 
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(3 概念 及 术语 


在 Web 中 ,新 的 概念 和 新 的 术语 很 多 , 随 着 Web 应 用 的 普及 ,这 些 本 来 是 专业 的 概念 
和 术语 已 经 大 众 化 了 。 下 面 从 计算 机 专业 的 角度 对 Web 中 的 一 些 常 用 概念 进行 简要 介绍 。 

(1) 网 站 (Web Site) 。 网 站 又 称 Web 站 点 ,是 Internet 中 提供 信息 服务 的 机 构 , 这 些 机 
构 的 计算 机 连接 到 Internet 中 ,向 用 户 提 供 Web 服务 。 此 外 , 随 着 B/S 架构 的 兴起 ,网 站 已 
经 成 为 计算 机 应 用 的 主要 模式 。 例 如 ,各 种 各 样 的 电子 商务 平台 ,其 作用 已 经 不 再 是 单纯 的 
信息 服务 ,而 是 一 个 计算 机 应 用 系统 了 。 

从 技术 上 讲 ,一 个 Web 站 点 由 一 个 主 目录 、 子 目录 及 其 包含 的 网 页 文件 、 图 片 文件 及 其 
他 各 类 文件 以 及 相关 的 数据 库 构成 。 网 页 文件 通常 包含 客户 端 脚本 程序 和 服务 端 脚本 程 
序 , 并 通过 超 链 接连 接 在 一 起 ,形成 特定 的 应 用 逻辑 ,构成 一 个 特定 的 Web 应 用 。 因 此 ,网 
站 又 称 为 Web 应 用 。 

Web 应 用 和 传统 的 应 用 程序 相 比 ,有 两 点 主要 的 不 同 。 呈 程序 的 构成 不 同 。 传 统 的 应 
用 程序 通常 是 由 一 个 exe 文件 和 相关 的 dll 库 构 成 ,而 Web 应 用 则 是 由 一 个 主 目录 及 其 包 
含 的 子 目录 和 大 量 网 页 文件 构成 。 回 运行 环境 不 同 。 传 统 应 用 程序 在 操作 系统 上 和 运行; 而 
Web 应 用 中 网 页 中 的 程序 包含 服务 端的 脚本 程序 和 客户 端 脚本 程序 ,服务 端的 脚本 程序 在 
Web 服务 器 上 运行 ,客户 端 脚本 程序 在 Web 浏览 器 中 运行 。 

(2) 超 文本 (Hypertext)。 超 文本 是 一 种 文本 显示 与 链接 技术 ,可 以 对 文本 中 的 有 关 词 
汇 或 句子 建立 链接 ( 即 超 链 接 ) ,使 其 指向 其 他 段落 ,文本 或 链接 到 其 他 文档 。 通 过 超 链接 ， 
可 以 在 文档 之 间 ,文档 内 部 之 间 跳 转 , 这 种 文本 的 组 织 方式 与 人 们 的 思维 方式 和 工作 方式 比 
较 接近 。 

当 超 文本 显示 时 ,建立 了 链接 的 文本 、 图 片 通常 以 下 划 线 、 高 亮 等 不 同 的 方式 显示 ,来 表 
明 这 些 文本 或 图 片 对 应 一 个 超 链 接 。 当 鼠标 指针 移 过 这 些 文字 时 ,指针 会 变 成 手 形 , 单 击 超 
链接 文本 或 图 片 ,可 以 转 到 相关 的 位 置 。 

(3) 超级 链接 (Hyperlink)。 在 Web 页 中 当 用 户 单 击 它 时 可 以 转 到 其 他 Web 页 或 当前 
页 面 的 其 他 地 方 的 文字 、 图 片 等 对 象 , 即 该 超级 链接 是 文本 超 链 接 和 图 片 超 链 接 。 如 果 是 文 
本 超 链接 , 超 链接 在 Web 页 上 往往 带 有 下 划 线 或 增 亮 显示 。 当 用 户 将 鼠标 指针 指向 一 个 超 
链接 时 ,指针 会 改变 为 手 的 形状 。 

(4) Web 页 (Web Page) 。Web 页 是 指 Web 服务 器 上 的 一 个 个 超 文本 文件 ,或 者 是 它 
们 在 浏览 器 上 的 显示 屏幕 。Web 页 中 往往 包含 指向 其 他 Web 页 面 的 超级 链接 。 在 Web 页 
面 中 ,除了 文本 、 图 片 等 内 容 外 ,通常 还 包含 客户 端 或 服务 端 脚 本 程序 。 因 此 ,Web 页 面 可 
分 为 普通 的 htm 页 面 和 服务 器 页 面 (Server Page)。 含 有 服务 端 脚 本 程序 的 页 面 称 为 服务 
器 页 ,根据 程序 的 语言 类 型 ,有 JSP 页 面 (Java Server Page)、ASP 页 面 (Active Server Page) 
等 。 不 含有 服务 端 脚本 程序 的 页 面 即 为 普通 htm 页 面 。 普 通 htm 页 面 可 包含 客户 端 脚本 
程序 ,如 JavaScript 程序 。 

(5) 主页 (Home Page) 。 对 于 一 个 Web 站 点 ,主页 通常 是 站 点 的 第 一 个 Web 页 ,这 类 
似 于 传统 应 用 程序 的 主 窗口 。 主 页 中 往往 列 出 了 网 站 的 信息 目录 ,或 指向 其 他 站 点 的 超 链 
接 ,主页 是 一 个 网 站 的 入 口 。 当 用 户 访 问 一 个 网 站 时 ,如 果 在 URL 中 不 指定 特定 的 网 页 文 
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件 , 则 Web 服务 器 将 站 点 主页 发 送 到 客户 端 。 在 Web 服务 器 的 配置 中 ,主页 又 称 为 默认 
文档 。 

(6) 统一 资源 定位 地 址 (Uniform Resource Locator, URL)。 统 一 资源 定位 地 址 可 以 唯 
一 标识 一 个 Web 页 .网 页 中 的 一 个 图 片 或 Internet 上 其 他 资源 的 一 个 地 址 , 它 将 Internet 
提供 的 各 类 服务 统一 编 址 ,以 便 用 户 通 过 Web 客户 浏览 程序 进行 信息 查询 。URL 的 一 般 
形式 为 : 


资源 类 型 :// 网 址 [ :端口 号 ][/[ 文 件 路 径 / 文 件 名 ]][? 参 数 名 = 参数 值 & 参数 名 = 参数 值 …] 


在 URL 中 ,除了 网 址 外 ,其 他 内 容 都 是 可 选 的 。 其 中 ,服务 类 型 主要 包括 http ftp 等 ; 
网 址 即 服务 器 的 域名 或 IP 地址 ,端口 号 对 应 一 个 特定 的 服务 ,默认 端口 号 可 以 省 略 , 例 如 
Web 服务 的 默认 端口 为 80,FTP 服务 的 默认 端口 为 21 等 ; 文件 路 径 为 网 页 相对 于 主 目录 
的 相对 路 径 ; 文件 名 是 用 户 浏览 器 指定 的 要 下 载 的 网 页 文件 ; 如 果 有 参数 ,在 文件 名 后 面 
跟 字符 “?” 列 出 参数 名 /参数 值 对 ,不同 的 参数 名 /参数 值 对 之 间 用 “&” 分 开 。 

在 浏览 器 地 址 栏 中 ,默认 端口 号 可 以 省 略 不 写 ,如 果 不 指定 文件 路 径 和 文件 名 , 则 默认 
访问 站 点 根 目 录 下 的 主页 文件 ,主页 文件 由 Web 服务 器 指定 。 例 如 ,如 果 用 户 在 浏览 器 地 
址 栏 中 输入 的 URL 为 http://www. sdu. edu. cn/, 则 表明 用 户 要 下 载 域名 为 www. sdu. 
edu. cn 的 Web 服务 器 中 根 目录 下 的 主页 文件 。 

(7) 端口 (Port)。 在 计算 机 通信 中 ,端口 用 于 识别 一 个 唯一 的 通信 程序 。 根 据 OSI 参 
考 模型 的 规定 ,数据 通信 和 最 终 被 封装 成 包 在 Internet 中 传递 , 当 数 据 包 到 达 接 收 方 时 ,在 接 
收 方 的 计算 机 上 可 能 运行 着 多 个 服务 程序 ,服务 程序 将 根据 到 达 的 数据 包 中 的 端口 号 来 决 
定 是 否 接 收 一 个 到 达 的 数据 包 , 这 和 旅客 在 机 场 的 行李 传送 带 旁 提取 自己 的 包 庄 类似。 

在 TCP/IP 中 , 按 协 议 类 型 划分 ,端口 可 以 分 为 TCP、UDP、IP 和 ICMP(Internet 控制 
消息 协议 ) 等 。 其 中 TCP 端口 和 UDP 端口 是 最 常见 的 端口 类 型 。 按 照 端口 号 分 布 划 分 , 端 
口 分 为 知名 端口 (Well-Known Ports) 和 动态 端口 (Dynamic Ports) 两 部 分 。 所 谓 知名 端口 ， 
是 指 范围 从 0 到 1023 的 端口 ,这 些 端 口号 一 般 固定 分 配给 一 些 知名 的 公共 服务 。 例 如 ， 
FTP 服务 的 端口 号 为 21,SMTP 服务 的 端口 号 为 25, HTTP 服务 的 端口 号 为 80 等 。 动态 
端口 是 指 范围 1024 一 65 535, 它 是 操作 系统 为 通信 程序 临时 分 配 的 端口 。 例 如 ,为 浏览 器 分 
配 的 端口 , 当 关闭 浏览 器 窗口 时 ,端口 被 收回 。 

在 网 络 安全 中 ,木马 和 黑客 程序 均 是 通过 特定 的 端口 来 控制 计算 机 的 ,因此 ,通过 设置 
TCP/IP 筛选 可 以 很 容易 地 切断 黑客 或 木马 的 攻击 。 利 用 命令 行 命令 "netstat -a -n” 查 看 当 
前 系统 正在 进行 通信 的 协议 端口 ,也 可 以 安装 *360 安全 卫士 ,查看 当前 的 通信 进程 及 所 使 
用 的 端口 号 。 这 有 助 于 发 现 系统 是 否 有 木马 在 运行 。 

(8) Web 2.0。 回 想 Web 诞生 之 初 , 人 们 面 对 一 个 个 静态 的 网 页 ,已 经 兴奋 不 已 。 今 
天 ,人 们 习惯 地 把 这 个 时 期 (2003 年 以 前 的 互联 网 模式 ) 的 互联 网 称 为 Web 1.0, 这 是 一 个 信息 
消费 的 时 代 , 人 们 通过 浏览 器 获取 信息 。 在 Web 1.0 时 代 ,Netscape 脱颖而出 ,成 为 互联 网 炮 
眼 的 新 星 , 它 的 浏览 器 ,把 广大 的 普通 用 户 带 入 了 互联 网 。 同 时 ,Yahoo 公司 提出 了 互联 网 黄 
页 ,Google 公司 推出 了 深 受 欢迎 的 搜索 服务 ,它们 为 互联 网 的 发 展 做 出 了 巨大 的 贡献 。 

随 着 网 络 的 发 展 , 网 站 的 拥有 者 发 现 , 只 有 网 民 的 参与 ,才能 持久 地 提高 与 保持 网 站 的 
人 气 。 从 一 开始 出 现 的 “论坛 "到 快速 火热 起 来 的 博客”, 互联 网 事实 上 已 经 逐渐 开始 了 一 
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种 理念 上 的 转变 ,实践 着 从 Web 1.0 到 Web 2.0 的 跨越 。 关 于 Web 2.0, 并 没有 一 个 统一 
的 定义 , 它 通常 是 指 注重 用 户 的 交互 作用 ,强调 用 户 的 广泛 和 深入 参与 ,被 认为 是 下 一 代 的 
软件 设计 模式 和 商业 模式 。Web 2.0 理念 使 得 网 站 的 展现 形式 更 加 多 样 化 ,产生 了 很 多 的 
典型 产品 ,例如 论坛 .名 人 博客 等 。 

(9) 博客 (Blog)。 博 客 (Blog) 的 全 名 是 Web log, 即 “网 络 日 志 ”, 后 来 缩写 为 Blog。 
Blog 是 继 E-mail、BBS、ICQ 之 后 出 现 的 第 四 种 网 络 交流 方式 ,是 以 超级 链接 为 武器 的 网 络 
日 记 , 代 表 着 一 种 新 的 生活 方式 和 新 的 工作 方式 。 而 博客 (Blogger) 则 指 的 是 使 用 特定 的 软 
件 , 在 网 络 上 出 版 .发表 和 张贴 个 人 文章 的 人 。 

从 技术 上 讲 , 一 个 Blog 就 是 一 个 网 页 , 它 通 常 是 由 简短 且 经 常 更 新 的 帖子 所 构成 ,这 些 
张贴 的 文章 按照 年 份 和 日 期 倒序 排列 。Blog 的 内 容 和 目的 有 很 大 的 不 同 ,有 的 是 个 人 的 一 
些 评论 .随笔 日记、 照片 等 ,有 的 则 是 一 群 人 基于 某 个 特定 主题 的 集体 创作 。2002 年 8 月 ， 
“博客 中 国 ”(http://www. blogchina. com/) 网 站 开通 , “博客 ”现象 在 中 国 互联 网 界 出 现 。 

现在 ,许多 门户 网 站 (例如 新 浪 、 网 易 等 ) 都 提供 博客 功能 ,用 户 可 以 免费 注册 并 发 表 文 
章 。 某 种 意义 上 说 ,博客 是 一 种 新 的 文化 现象 ,博客 的 出 现 和 繁荣 ,真正 凸显 网 络 的 知识 价 
值 ,标志 着 互联 网 发 展开 始 步 人 更 高 的 阶段 。 

(10) 微 博 (MicroBlog)。 微 博 , 即 微 博客 (MicroBlog) 的 简称 ,是 一 个 基于 用 户 关系 的 
信息 分 享 、 传 播 以 及 获取 平台 ,用 户 可 以 通过 Web、WAP 以 及 各 种 客户 端 软件 来 更 新 或 获 
取信 息 , 以 140 字 左 右 的 文字 更 新 信息 ,并 实现 即时 分 享 。 最早 也 是 最 著名 的 微 博 是 美国 的 
Twitter。2009 年 8 月 ,新 浪 网 推出 “新 浪 微 博 ”, 提 供 微 博 服务 , 微 博 正 式 进 入 中 文 上 网 主流 
人 群 视野 。 

与 博客 相 比 , 微 博 是 一 种 通过 关注 机 制 分 享 简短 实时 信息 的 广播 式 的 社交 网 络 平台 , 具 
有 可 以 单 向 或 双向 关注 机 制 、 内 容 简 短 、 实 时 广播 的 特点 。2010 年 开始 , 微 博 像 雨 后 春笋 般 
崛起 ,四 大 门户 网 站 均 开 设 微 博 服务 。 据 中 国 互联 网 络 信息 中 心 CCNNIC) 发 布 的 (第 28 次 
中 国 互联 网 络 发 展 状况 统计 报告 ) 显 示 ,2011 年 上 半年 ,中 国 微 博 用 户 从 6331 万 增 至 1. 95 
亿 , 增 长 约 2 倍 。 微 博 在 网 民 中 的 普及 率 从 13. 8% 增 至 40.2%, 手 机 微 博 在 网 民 中 的 使 用 
率 从 15.5% 上 升 到 34%。 

(11) RSS 订阅 。 网 络 信息 量 每 天 都 以 惊人 的 速度 增长 ,人 们 通常 以 搜索 引擎 的 方式 搜 
索 需 要 的 信息 ,对 于 扑面 而 来 的 新 闻 , 则 需要 花费 大 量 的 时 间 冲 浪 和 从 新 闻 网 站 下 载 。 即 使 
如 此 ,有 大 量 的 新 闻 或 信息 可 能 因为 没有 及 时 浏览 而 错过 。 

相对 于 传统 的 信息 浏览 ,RSS(Really Simple Syndication ,简易 信息 聚合 ) 订 阅 则 是 一 种 
全 新 的 资讯 传播 方式 , 它 采 用 推 技 术 将 订阅 的 页 面 发 送 到 客户 的 RSS 阅读 器 或 Web 浏览 
器 中 。 只 要 用 户 下 次 打开 RSS 阅读 器 或 支持 RSS 订阅 的 浏览 器 ,被 订阅 的 页 面 将 显示 在 
频道 列表 中 。 提 供 RSS 订阅 的 站 点 或 页 面 通常 被 标记 为 XML 或 RSS 的 橙色 图 标 ,例如 ， 
网 易 RSS 订阅 中 心 (http://www. 163. com/rss/)。 


人 4 Web 相关 技术 


进入 20 世纪 90 年 代 以 后 , 随 着 Internet 技术 的 不 断 发 展 ,特别 是 Web 的 出 现 ,对 计算 
机 的 计算 模式 ,软件 开发 模式 、 应 用 模式 都 产生 了 重要 的 影响 ,这 导致 了 一 系列 相关 技术 的 
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出 现 ,并 推动 着 Web 技术 的 发 展 。 
1.4.1 Java 技术 


Java 技术 是 Sun 公司 于 1995 年 推出 的 一 种 极 富 创造 力 的 计算 平台 。 狭 义 上 讲 ,Java 
技术 可 以 理解 为 Java 语言 ; 广义 上 讲 ,Java 技术 包括 Java 语言 ,Java 虚拟 机 以 及 Java API 
等 。Java 技术 为 用 户 带 来 了 无 数 令 人 兴奋 的 可 能 性 , 它 几 乎 使 所 有 应 用 程序 (包括 游戏 、 工 
有 具 和 服务 程序 ) 能 在 任何 计算 机 或 设备 上 运行 。Java 技术 的 多 功能 性 \ 有 效 性 .平台 的 可 移 
植 性 以 及 安全 性 已 经 使 它 成 为 网 络 计 算 领 域 最 完美 的 技术 。 今 天 ,Java 技术 已 经 无 处 不 
在 ,从 桌面 PC 到 科学 超级 计算 机 和 互联 网 ,从 移动 电话 到 移动 手持 设备 ,从 家 庭 游戏 机 到 
信用 卡 ,几乎 在 所 有 的 网 络 和 设备 上 都 会 看 到 Java 技术 的 身影 。 


1. Java 的 出 现 


1991 年 ,Sun 公司 计划 开拓 消费 类 电子 产品 市 场 , 为 电视 、 烤 面包 箱 等 家 用 消费 类 电子 
产品 开发 一 个 分 布 式 代 码 系统 ,目的 是 可 以 通过 Internet 与 家 电 产 品 进行 交互 ,以 便 对 其 进 
行 控制 。Sun 公司 内 部 人 员 把 这 个 项 目 称 为 Green, 该 小 组 的 领导 人 是 James Gosling, 他 是 
一 位 非常 杰出 的 程序 员 。Gosling 于 1984 年 加 盟 Sun 公司 ,之 前 在 一 家 IBM 研究 机 构 工 
作 , 他 是 SunNeWs 窗口 系统 的 总 设计 师 , 也 是 第 一 个 用 C 实现 的 EMACS 文本 编辑 器 
COSMACS 的 开发 者 。 

开始 ,他 们 准备 用 C++ 语言 开发 ,但 是 ,C++ 太 复 杂 , 且 存在 安全 性 问题 。 于 是 ,在 1991 
年 6 月 James Gosling 开始 准备 基于 C++ 开发 一 个 新 的 语言 ,看 着 窗外 的 一 棵 老 橡 树 ,就 将 
这 个 新 的 语言 命名 为 Oak, 它 就 是 Java 的 前 身 。Oak 是 一 种 用 于 网 络 的 精巧 而 安全 的 语 
言 ,Sun 公司 使 用 它 参 加 一 个 交互 式 电 视 项 目的 投标 ,结果 败 于 SGI 公司 ?0, 为 此 Oak 几乎 
销声匿迹 。 此 时 ,受到 Marc Andreessen 开发 的 Mosaic 和 Netscape 的 启发 ,他 们 将 Oak 继 
续 完 善 。 因 为 ,此 时 发 现在 此 之 前 Oak 已 是 Sun 公司 另 一 个 语言 的 注册 商标 ,他 们 将 新 的 
Oak 改名 为 Java, 即 太平 洋 上 一 个 盛产 咖啡 的 岛屿 (爪哇 岛 ) 的 名 字 。 

James Gosling 在 开始 写 Java 时 ,并 不 局 限于 扩充 语言 机 制 本 身 , 更 注重 于 语言 所 运行 
的 软 硬 件 环境 。 他 要 建立 一 个 系统 ,这 个 系统 运行 于 一 个 巨大 的 、 分 布 的 . 异 构 的 网 格 环境 
中 ,完成 各 种 电子 设备 之 间 的 通信 和 与 协同 工作 。James Gosling 在 设计 中 采用 了 虚 机 器 码 
(Virtual Machine Code) 方 式 , 即 Java 语言 编译 后 产生 的 是 虚拟 机 ,虚拟 机 运行 在 一 个 解释 
器 上 ,每 一 个 操作 系统 均 有 一 个 解释 器 。 这 样 一 来 ,Java 就 成 了 平台 无 关 语 言 , 这 和 James 
Gosling 设计 的 SunNeWs 窗口 系统 有 着 相同 的 技术 思想 。 在 SunNeWs 中 ,用 户 界 面 统一 
用 PostScript 描述 ,不 同 的 显示 器 有 不 同 的 PostScript 解释 器 ,这 样 便 保 证 了 用 户 界 面 良 好 
的 可 移植 性 。 

后 来 ,Patrick Naughton 加 入 到 该 项 目 , Naughton 也 是 Sun 公司 的 技术 骨干 ,曾经 是 
Open Windows 项 目的 负责 人 。 整 个 工作 进展 神速 ,经 过 17 个 月 的 奋战 ,整个 系统 顺利 完 
成 。 它 是 由 一 个 操作 系统 、 一 种 语言 (Java) 一 个 用 户 界面 一 个 新 的 硬件 平台 ,三 块 专用 芯 


@ ”SGI 公司 为 美国 图 形 工作 站 生产 厂商 。 
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片 构成 的 。 项 目 完成 后 ,在 Sun 公司 内 部 做 了 一 次 展示 和 鉴定 ,观众 的 反应 是 : 在 各 方面 都 
采用 了 胃 新 的 非常 大 胆 的 技术 。 


2. Java 语言 环境 


1994 年 ,WWW 已 如 火 如 茶 地 发 展 起 来 。Gosling 意识 到 WWW 需要 一 个 中 性 的 浏览 
器 , 它 不 依赖 于 任何 硬件 平台 和 软件 平台 , 它 应 是 一 种 实时 性 较 高 .可靠 安全 、 有 交互 功能 的 
浏览 器 。 于 是 ,Gosling 决定 用 Java 开发 一 个 新 的 Web 浏览 器 ,这 就 是 1994 年 秋天 完成 的 
WebRunner, 这 个 原型 系统 展示 了 Java 可 能 带 来 的 广阔 市 场 前 景 。 后 来 , WebRunner 改名 
为 HotJava, 并 于 1995 年 5 月 23 日 发 表 后 ,在 产业 界 引起 了 巨大 篆 动 ,Java 的 地 位 也 随 之 
得 到 肯定 。 

1995 年 ,Sun 公司 虽然 推出 了 Java, 但 这 只 是 一 种 语言 ,而 要 想 开 发 复杂 的 应 用 程序 ， 
必须 要 有 一 个 强大 的 开发 库 支持 。 因 此 ,又 经 过 一 年 的 试用 和 改进 ,Sun 公司 在 1996 年 1 
月 23 日 发 布 了 JDK 1.0。 这 个 版 本 包括 了 两 部 分 : 运行 环境 (Java Running Environment， 
JRE) 和 开发 环境 (Java Development Kit,JDK) 。 在 运行 环境 中 包括 了 核心 API、 集 成 API、 
用 户 界面 API' 发 布 技术 .Java 虚拟 机 (Java Virtual Machine,JVM) 五 个 部 分 。 开 发 环境 包 
括 编译 Java 程序 的 编译 器 ( 即 javac)。 在 JDK 1.0 时 代 ,JDK 除了 抽象 窗口 工具 包 
(Abstract Windowing Toolkit,AWT, 一 种 用 于 开发 图 形 用 户 界面 的 APD) 外 ,其 他 的 库 并 
不 完整 。 

Sun 公司 在 推出 JDK 1.0 后 , 紧 跟着 ,在 1997 年 2 月 18 日 发 布 7 了 JDK 1.1。JDK 1.1 
相对 于 JDK 1.0 最 大 的 改进 就 是 为 JVM 增加 了 JIT( 即 时 编译 ) 编 译 器 。JIT 和 传统 的 编 
译 器 不 同 , 传 统 的 编译 器 是 编译 一 条 ,运行 完 后 再 将 其 扔 掉 ,而 JIT 会 将 经 常用 到 的 指令 保 
存在 内 存 中 ,在 下 次 调用 时 就 不 需要 再 编译 了 ,这 样 JDK 在 效率 上 有 了 非常 大 的 提升 。 

随后 ,一 些 著名 的 计算 机 公司 纷纷 购买 了 Java 的 使 用 权 ,IBM、 Apple、DEC、 Adobe、 
Silicon Graphics\ HP Oracle Toshiba、Netscape 和 Microsoft 等 大 公司 相继 购买 了 Java 的 
许可 证 。 另 外 ,众多 的 软件 开发 商 也 开发 了 许多 支持 Java 的 软件 产品 。 在 以 网 络 为 中 心 的 
计算 机 时 代 , 不 支持 HTML 和 Java, 就 意味 着 应 用 程序 的 应 用 范围 只 能 限于 同 质 的 环境 。 

Java 的 平台 无 关 性 给 未 来 的 计算 模式 产生 了 革命 性 的 影响 , 它 是 继 HTML 后 ， 
Internet 发 展 的 又 一 个 里 程 碑 。 


3. Java 的 技术 特征 


在 Sun 公司 的 Java 语言 白皮书 中 ,说 明 Java 语言 有 如 下 特征 : 简单 .面向 对 象 、. 体 系 结 
构 中 立 、 解 释 执行 .可 移植 ,分布 式 .具有 安全 性 。 

(1) 简单 (Simple) 。 主 要 体现 在 三 个 方面 : DJava 语言 风格 来 源 于 C++ ,因此 C++ 程序 
员 可 以 很 快 地 上 手 ; @Java 按 弃 了 C++ 中 容易 引发 错误 的 地 方 ,如 指针 ,增加 了 内 存 管 理 等 
一 些 新 的 特色 ; @Java 提供 了 丰富 的 类 库 ,使 用 户 编程 更 加 简单 。 

(2) 面向 对 象 CObjectrOriented) 。Java 是 面向 对 象 的 语言 , 按 弃 了 C++ 中 全 局 变量 等 
与 面向 对 象 思想 冲突 的 内 容 。 

(3) 体系 结构 中 立 (Architecture Neutral) 。 一 般 情 况 下 ,网 络 环境 都 是 异 构 的 ,如 何 使 
一 个 应 用 程序 能 够 在 不 同 硬件 .不 同 操作 系统 平台 的 计算 机 上 运行 ,始终 是 一 个 难题 。Java 
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将 它 的 程序 编译 成 一 种 结构 中 立 的 中 间 文 件 格式 ,由 Java 虚拟 机 来 解释 执行 这 种 中 间 代 
码 。 这 使 得 Java 应 用 程序 可 以 在 不 同 的 处 理 器 中 执行 ,现在 几乎 所 有 的 主流 计算 机 系统 都 
能 运行 Java。 

(4) 解释 执行 (Interpreted) 。Java 解释 器 能 直接 地 在 任何 机 器 上 执行 Java 字 节 码 。 

(5) 可 移植 (Portable) 。 体 系 结构 无 关 的 特性 使 Java 程序 可 以 在 配备 了 Java 虚拟 机 的 
任何 计算 机 系统 上 运行。 另外 ,通过 定义 独立 于 平台 的 基本 类 型 及 其 运算 ,Java 数据 得 以 
在 任何 硬件 平台 上 保持 一 致 。 

(6) 分 布 式 (Distributed)。Java 程序 的 程序 库 可 以 很 容易 地 与 HTTP 和 FTP 等 
TCP/IP 配合 ,从 而 使 Java 程序 可 以 凭借 URL 打开 并 访问 网 络 对 象 ,对 程序 员 来 讲 ,访问 
方式 和 访问 本 地 文件 系统 几乎 一 样 ,这 就 为 Internet 等 分 布 环 境 提供 内 容 带 来 了 方便 。 

(7) 安全 性 (Secure) 。Java 是 被 设计 用 于 网 络 和 分 布 式 环境 的 ,安全 性 自然 是 一 个 重 
要 的 考虑 因素 。Java 的 安全 性 可 以 从 两 个 方面 考虑 : @@ 内 存 的 安全 性 ,如 按 弃 了 C++ 中 的 
指针 ,从 而 避免 了 非法 内 存 操作 和 内 存 泄漏 ; @ 当 用 Java 来 创建 浏览 器 内 容 时 ,语言 功能 
和 浏览 器 本 身 的 功能 结合 ,使 它 更 安全 。 


4. Java 的 发 展 


十 多 年 来 ,Java 技术 的 发 展 总 是 日 新 月 异 , 从 葛 定 Java 根基 的 Java 开发 包 JDK 1.0, 到 今 
天 的 JDK 6.0,Java 为 开发 人 员 提 供 的 标准 类 库 越 来 越 丰富 ,Java 技术 取得 了 长 足 的 进步 。 

从 JDK 1.0 到 JDK 1.1.8,JDK 1.x 经 过 了 9 个 小 版 本 的 发 展 ,已 经 初 具 规模 。1998 
年 12 月 4 日 ,Sun 公司 发 布 了 Java 历史 上 最 重要 的 一 个 JDK 版 本 一 一 JDK 1.2, 这 个 版 本 
标志 着 Java 进入 了 Java2 时 代 , 进 入 Java 的 飞速 发 展 时 期 。 

在 Java2 时 代 ,Sun 公司 对 Java 进行 了 很 多 革命 性 的 变化 ,将 JDK 1. 2 一 分 为 三 ,Java 
被 分 成 了 J2EE (Java2 Platform Enterprise Edition )、J2SE (Java2 Platform Standard 
Edition) 和 J2ME(Java2 Platform Micro Edition) ,分 别 面向 企业 级 .桌面 .嵌入 式 和 移动 计 
算 等 领域 。 这 些 革命 性 的 变化 一 直 沿用 到 现在 ,对 Java 的 发 展 形成 了 深远 的 影响 。 

从 JDK 1.2 开始 ,Sun 公司 以 平均 两 年 一 个 版 本 的 速度 推出 新 的 JDK。2000 年 5 月 8 
日 ,Sun 公司 对 JDK 1.2 进行 了 重大 升级 ,推出 了 JDK 1.3。Sun 在 JDK 1.3 中 同样 进行 了 
大 量 的 改进 ,主要 表现 在 一 些 类 库 (如 数学 运算 、 新 的 Timer API 等 ) 上 在 JNDI 接口 方面 
增加 了 一 些 DNS 的 支持 ,增加 了 JNI 的 支持 等 。2002 年 2 月 13 日 ,Sun 发 布 了 JDK 历史 
上 最 为 成 熟 的 版 本 JDK 1. 4。 这 次 Sun 公司 将 主要 精力 放 到 了 Java 的 性 能 上 ,使 JDK 1.4 
的 性 能 有 了 质 的 飞跃 。 到 JDK 1.4 为止, 人 们 已 经 可 以 使 用 Java 实现 大 多 数 的 应 用 了 。 

虽然 从 JDK 1.4 开始 ,Java 的 性 能 有 了 显著 的 提高 ,但 Java 又 面临 着 另 一 个 问题 , 那 就 
是 复杂 。2004 年 10 月 ,Sun 公司 发 布 了 JDK 1.5, 同 时 ,将 JDK 1.5 改 名 为 J2SE5.0。 与 
JDK 1.4 不同 ,JDK 1.4 的 主题 是 性 能 ,而 J2SE5.0 的 主题 是 易 用 。 

2006 年 4 月 ,Sun 公司 推出 J2SE6. 0 测试 版 ,2006 年 12 月 ,代号 为 Mustang( 野 马 ) 的 
J2SE6.0 正式 版 推 向 市 场 ,在 性 能 、 易 用 性 方面 得 到 了 前 所 未 有 的 提高 。2006 年 12 月 ,Sun 
公司 发 布 JRE6. 0。 

2009 年 4 月 20 日 ,Oracle 和 Sun 公司 发 布 了 联合 声明 ,Oracle 收购 了 Sun 公司 。Sun， 
这 个 让 全 球 软件 开发 者 曾 热血 沸腾 、 视 为 心灵 家 园 的 品牌 ,这 个 为 世界 贡献 了 一 整套 包括 
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Java 在 内 的 全 系列 开源 软件 和 “网 络 即 计算 机 ”战略 方向 的 Sun, 将 为 Oracle 公司 贡献 出 自 
己 的 所 有 ,也 将 慢 慢 地 尖 没 在 历史 的 长 河中 …… 


1.4.2 XML 技术 


可 扩展 置 标 语言 (eXtensible Markup Language, XML) 是 Internet 上 最 具 权 威 的 数据 表示 
和 数据 交换 标准 , 它 是 国际 标准 化 组 织 (International Organization for Standardization ,ISO) 的 
通用 标记 语言 标准 (Standard for General Markup Language,SGML) 的 一 个 简化 子 集 。 


1. XML 的 技术 特征 


XML 关注 信息 本 身 ,是 Web 上 表示 结构 化 信息 的 一 种 标准 文本 格式 。 与 传统 的 注重 
页 面 信息 显示 的 超 文本 标记 语言 (Hypertext Markup Language,，HTML) 相 比 ,关注 于 内 容 
的 XML 具有 以 下 优点 : 良好 的 可 扩展 性 ,语言 简单 有 效 , 可 自行 定义 标记 ; 内 容 与 形式 的 
分 离 , 主 要 刻画 数据 内 容 , 不 考虑 显示 效果 ; 有 严格 的 语法 要 求 , 便 于 分 析 和 与 数据 库 信 息 
转换 ; 便于 传输 ,为 纯 文本 形式 ,可 通过 HTTP 直接 传输 ,可 跨越 防火 墙 等 。 

XML 的 出 现 和 发 展 对 于 Internet 产生 了 巨大 的 影响 ,如 果 说 Java 实现 了 代码 的 平台 
无 关 性 ,那么 XML 则 实现 了 数据 的 平台 无 关 性 。 今 天 ,XML 已 经 逐渐 成 为 整个 Web 的 基 
本 结构 和 未 来 各 种 发 展 的 基础 ,由 于 XML 能 针对 特定 的 应 用 定义 自己 的 标记 语言 ,使 得 
XML 可 以 在 电子 商务 ,政府 部 门 . 各 行业 领域 提供 各 具 特 色 的 独立 解决 方案 。 同 时 ,XML 
作为 一 种 通用 的 数据 交换 语言 ,已 经 成 为 业界 的 一 种 具有 芍 断 性 的 标准 ,在 跨 平台 跨 系统 数 
据 交换 方面 拥有 无 可 比拟 的 优势 ,其 在 企业 级 开发 中 所 扮演 的 角色 越 来 越 重 要 。 但 是 ,和 关 
系数 据 库 拥 有 强大 的 存储 和 分 析 引 擎 不 同 ,XML 只 专注 于 数据 的 表示 ,这 也 使 得 XML 在 
数据 量 急速 膨胀 时 ,如 何 有 效 地 管理 和 使 用 XML 成 为 了 一 件 令 人 头痛 的 事情 。 


2. XML 相关 技术 标准 


虽然 XML 标准 本 身 相 对 简单 ,但 与 XML 相关 的 标准 却 种 类 繁多 ,W3C 制定 的 相关 标 
准 就 有 二 十 多 个 ,采用 XML 制定 的 各 种 应 用 标准 也 很 多 。 除 了 标准 种 类 繁多 外 ,标准 之 间 
通常 还 互相 引用 ,特别 是 应 用 标准 ,它们 的 制定 不 仅仅 使 用 的 是 XML 标准 本 身 , 还 常常 用 
到 了 其 他 很 多 标准 。 在 XML 标准 体系 中 ,XML 相关 标准 可 分 为 元 语言 标准 、 基 础 标准 、 应 
用 标准 三 个 层次 。 

(1) 元 语言 (Meta-language) 标 准 : 描述 的 是 用 来 描述 标准 的 元 语言 ,是 整个 体系 的 核 
心 ,其 他 XML 相关 标准 都 是 用 它 制定 的 或 为 其 服务 的 。 

(2) 基础 标准 (Foundation Standards) : 这 一 层次 的 标准 是 为 XML 的 进一步 实用 化 制 
定 的 ,规定 了 采用 XML 制定 标准 时 的 一 些 公用 特征 、 方 法 或 规则 。 例 如 ,XML Schema 描 
述 了 更 加 严格 地 定义 XML 文档 的 方法 ,以 便 可 以 更 自动 化 地 处 理 XML 文档 ; XML 
Namespace 用 于 保证 XML DTD 中 名 字 的 一 致 性 ,以 便 不 同 的 DTD 中 的 名 字 在 需要 时 可 
以 合并 到 一 个 文档 中 。 

(3) 应 用 标准 (Application Standards) : 以 XML 为 基础 制定 的 行业 标准 。 比 较 常 用 的 
应 用 标准 包括 SVG( 有 关 矢 量 图 形 )、SMIL( 有 关 多 媒体 同步 显示 )、MathML( 有 关 数 学 公 
式 符 号 ) 等 。 在 电子 商务 领域 的 应 用 标准 有 Micropayments (W3C 制定 )、BizTalk 
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(Microsoft 发 起 的 电子 商务 Schema 库 ) .ebXML (联合 国 UN/CEFACT 小 组 和 OASIS 共 
同 发 起 ) .PIP( 由 诸多 IT 业 的 巨子 组 成 的 一 个 标准 化 组 织 RosettaNet 的 应 用 网 络 标准 ) 等 。 
XML 相关 技术 标准 体系 如 图 1-2 所 示 。 


MathML VoiceXML PIP 

SMIL WAP BizTalk SOAP 

应 用 标准 
SVG HDML ebXML OEB 
HTML CC/PP Paments TV/Web 
| DOM | SAX | P3P | 
XSL CSS RDF XForm 
XLink XPointer XQuery XBase 
Schema Namespace XPath 
ME 元 语言 标准 


图 1-2 XML 技术 标准 体系 


在 XML 技术 标准 体系 中 ,主要 的 基础 标准 的 功能 划分 是 : XML Schema 描述 了 更 加 
严格 定义 XML 文档 的 方法 ,以 便 可 以 更 自动 地 处 理 XML 文档 ; XML Namespace 用 于 保 
证 XML DTD 中 名 字 的 一 致 性 ,以 便 不 同 的 DTD 中 的 名 字 在 需要 时 可 以 合并 到 一 个 文档 
中 ; XPath 描述 如 何 识 别 .选择 .匹配 XML 文件 中 的 各 个 构成 元 件 ,包括 元 素 、. 属 性 ,文字 内 
容 等 ; XPointer 和 XLink 标准 ,规定 了 有 关 定 位 、 链 接 方面 的 内 容 ; XQuery 的 目的 是 为 从 
Web 文 档 中 提取 数据 ,提供 一 种 灵活 的 查询 机 制 ; XSLT 则 实现 文档 格式 转换 ,主要 是 将 
XML 转换 为 HTML 格式 进行 显示 ; CSS 也 是 用 来 作为 XML 文档 显示 的 样式 标准 ; DOM 
定义 了 一 组 与 平台 和 语言 无 关 的 接口 ,以 便 程 序 和 脚本 能 够 动态 访问 和 修改 XML 文档 内 
容 、 结 构 及 样式 。 


1.4.3 Web 服务 


在 传统 意义 下 ,软件 开发 模式 是 编程 人 员 编 写 系 统 的 每 一 行 代码 ,当然 包括 库 函 数 调 
用 ,调用 库 函 数 可 以 提高 编程 效率 和 代码 质量 。 软 件 开发 完成 后 ,用 户 需 要 安装 ,才能 使 用 。 
Web 服务 (Web Service) 是 一 种 新 型 的 软件 开发 模式 ,在 该 模式 下 ,传统 的 软件 功能 模块 不 
再 以 函数 方式 提供 以 实现 二 进 制 代码 级 的 重用 ,而 是 被 封装 成 Web 服务 ,实现 业务 级 的 重 
用 和 集成 。 


1. 基于 Web 服务 的 软件 开发 模式 


假设 开发 人 员 需 要 搭建 一 个 商务 网 站 ,这 个 网 站 需要 一 个 验证 客户 合法 身份 的 功能 。 
可 以 采取 以 下 方法 实现 这 个 功能 。 
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(1) 由 开发 人 员 自 己 编写 安全 验证 所 需 的 全 部 程序 代码 。 

(2) 购买 这 段 程序 (通常 是 一 个 ActiveX 组 件 )。 在 收 到 组 件 之 后 ,首先 将 组 件 注册 在 
自己 的 机 器 上 ,然后 根据 组 件 类 型 库 产生 接口 文件 。 在 实际 编程 中 就 可 以 使 用 这 个 接口 文 
件 来 访问 组 件 服务 。 

(3) 使 用 Web 服务 。 只 需 在 自己 的 程序 中 通过 访问 某 个 服务 的 URL 地 址 ,得 到 一 份 
XML 描述 ,并 使 用 这 个 描述 文件 产生 一 个 接口 文件 。 然 后 ,在 实际 编程 中 ,通过 这 个 接口 
文件 来 访问 服务 。 该 模式 ,这 个 服务 并 不 运行 在 用 户 的 机 器 上 ,而 是 运行 在 服务 提供 者 的 服 
务 器 上 。 

基于 Web 服务 的 软件 开发 模式 如 图 1-3 所 示 。 


Web 站 点 


客户 应 用 程序 


服务 组 件 | 


间 


客户 应 用 程序 


服务 组 件 
| 


客户 应 


图 1-3 基于 Web 服务 的 软件 开发 模式 


Web 服务 使 用 标准 化 的 XML 消息 传递 机 制作 为 基本 的 数据 通信 方式 ,消除 使 用 不 同 
组 件 模型 .操作 系统 和 编程 语言 的 系统 之 间 存 在 的 差异 ,使 异类 系统 能 够 作为 计算 网 络 的 一 
部 分 协同 运行 。 开 发 人 员 可 以 使 用 像 过 去 创建 分 布 式 应 用 程序 时 使 用 组 件 的 方式 ,创建 由 
各 种 来 源 的 Web 服务 组 合 在 一 起 的 应 用 程序 。 


2. Web 服务 体系 架构 


Web 服务 是 一 种 自 包含 、 自 解释 、 模 块 化 的 在 线 应 用 程序 。 采 用 XML 作为 基本 的 标记 
语言 ,SOAP(Simple Object Access Protocol, 简单 对 象 访 问 协 议 ) 作 为 互 操作 协议 ,WSDL 
(Web Service Description Language. Web 服务 描述 语言 ) 作 为 服务 描述 语言 ,通过 UDDI 
(Universal Description Discovery & Integration ,通用 描述 .发现 与 集成 ) 可 以 把 服务 注册 到 
互联 网 以 便 使 用 者 搜索 ,为 用 户 提供 服务 。 

Web 服务 的 体系 结构 由 三 个 参与 者 和 三 个 基本 操作 构成 。 三 个 参与 者 分 别 是 服务 提 
供 者 、 服 务 请 求 者 和 服务 代理 ,三 个 基本 操作 分 别 为 发 布 (publish)、 查 找 (find) 和 绑 定 
(bind) ,其 关系 如 图 1-4 所 示 。 

服务 提供 者 将 其 服务 发 布 到 服务 代理 的 一 个 目录 上 ; 当 服 务 请 求 者 需要 调用 该 服务 
时 ,服务 提供 者 首先 利用 服务 代理 提供 的 目录 去 搜索 该 服务 ,得 到 如 何 调用 该 服务 的 信息 ， 
然后 根据 这 些 信息 去 调用 服务 提供 者 发 布 的 服务 ; 当 服 务 请 求 者 从 服务 代理 得 到 调用 所 需 
服务 的 信息 之 后 ,通信 是 在 服务 请 求 者 和 服务 提供 者 之 间 直 接 进行 ,而 无 须 经 过 服务 代理 。 
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图 1-4 Web 服务 体系 结构 


3. Web 服务 相关 技术 标准 


Web 服务 相关 技术 标准 如 下 。 

(1) 可 扩展 标记 语言 (XML) , 它 是 Web 服务 的 驱动 力 。XML 不 是 一 种 编程 语言 或 者 
API, 而 是 一 种 独立 于 平台 的 组 织 数据 的 方式 。XML 的 语法 便于 通过 编程 来 处 理 文本 数 
据 , 同 时 又 便于 为 人 们 所 理解 。Web 服务 使 用 XML 作为 标准 ,在 网 络 设备 之 间 进 行 通信 。 

(2) 简单 对 象 访问 协议 (Simple Object Access Protocol,SOAP) 是 在 分 散 或 分 布 式 的 环 
境 中 交换 信息 的 简单 的 协议 ,开发 人 员 可 以 使 用 这 种 独立 于 平台 的 机 制 ,远程 调用 分 布 式 对 
象 的 方法 。SOAP 消息 的 通信 使 用 XML 来 描述 对 象 .方法 以 及 执行 的 参数 。 客 户 机 和 服 
务 器 都 可 以 实现 和 使 用 SOAP。 

相对 于 传统 的 公共 对 象 请 求 代理 体系 结构 (Common Object Request Broker Architecture， 
CORBA) 和 分 布 式 组 件 对 象 模型 (Component Object Model / Distributed Component 
Object Model,COM/DCOM) 标 准 ,SOAP 采用 HTTP 作为 底层 通信 协议 ,RPC(CRemote 
Procedure Call) 作 为 一 致 性 的 调用 途径 ,XML 作为 数据 传送 的 格式 ,允许 服务 提供 者 和 服 
务 客 户 经 过 防火 墙 在 Internet 进行 通信 交互 ,可 以 说 SOAP= 二 HTTP 十 RPC 二 XML。 

(3) Web 服务 描述 语言 (Web Service Description Language,WSDL) 是 用 XML 文档 来 
描述 Web 服务 的 标准 ,是 Web 服务 的 接口 定义 语言 , 它 从 句法 层面 对 Web 服务 的 功能 进 
行 描述 ,包括 Web 服务 的 三 个 基本 属性 : 四 服务 做 些 什么 , 即 服务 所 提供 的 操作 方法 ; @ 如 
何 访问 服务 , 即 和 服务 交互 的 数据 格式 以 及 必要 协议 ; 加 服务 位 于 何 处 , 即 协 议 相 关 的 地 
址 ,如 URL。 

WSDL 文档 结构 包括 四 个 部 分 : Port Type( 访 问 端口 )、.Binding (为 每 个 端口 定义 消息 
格式 和 协议 细节 )、Message(Web 服务 使 用 的 消息 )、Data Type(Web 服务 使 用 的 数据 类 型 ， 
使 用 XML Schema 语法 来 定义 数据 类 型 )。WSDL 只 是 提供 了 Web 服务 的 接口 描述 ,对 服 
务 的 行为 约束 和 属性 描述 缺乏 进一步 的 支持 。 

(4) 通用 描述 ,发 现 和 集成 (UDDD 协 议 是 为 解决 Web 服务 的 发 布 和 发 现 而 制定 的 基 
于 Internet 的 电子 商务 技术 标准 , 它 包含 一 组 基于 Web 的 ,分布 式 的 Web 服务 信息 注册 中 
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心 的 实现 标准 ,以 及 一 组 使 企业 能 将 自己 提供 的 Web 服务 注册 到 该 中 心 的 实现 标准 。 
UDDI 定 义 了 一 组 基于 SOAP 消息 的 公用 SOAP API, 用 户 利用 SOAP 消息 来 查找 和 注册 
Web 服务 ,并 为 应 用 程序 提供 接口 来 访问 注册 中 心 。 

服务 注册 (Service Registry) 是 一 种 服务 代理 , 它 是 在 UDDI 上 需要 发 现 服务 的 请 求 者 
和 发 布 服务 的 提供 者 之 间 的 中 介 。 当 请 求 者 决定 使 用 特定 的 服务 时 ,通常 以 借助 于 开发 工 
具 ( 如 Microsoft Visual Studio .NET) 创 建 并 发 送 服务 请 求 ,然后 处 理 响应 的 方式 访问 服务 
的 代码 来 绑 定 服务 。 

(5) 语义 Web 服务 标记 语言 (OWIL-S) ,是 语义 Web 服务 标记 语言 的 标准 , 它 比 WSDL 
更 能 向 用 户 提供 可 理解 的 服务 资源 的 描述 形式 ,提高 服务 选取 与 推荐 的 准确 性 。 语 义 Web 
服务 的 主要 方法 是 利用 本 体 (Ontology) 来 描述 Web 服务 ,然后 通过 这 些 带 有 语义 信息 的 描 
述 实现 Web 服务 来 实现 服务 的 自动 发 现 、 调 用 和 组 合 。 语 义 Web 和 Web 服务 是 语义 Web 
服务 的 两 大 支撑 技术 。OWL-S 是 连接 两 大 技术 的 桥梁 ,目前 对 语义 Web 服务 标记 语言 
究 最 重要 的 组 织 就 是 DARPA ,其 研究 组 OWL Services Coalition 提出 了 语义 Web 服务 标 
记 语 言 (OWL-S)。 


4. Web 服务 技术 的 优势 


Web 服务 技术 有 如 下 优势 。 

(1) 平台 无 关 、 语 言 无 关 性 。Web 服务 技术 的 主要 目标 是 在 现 有 的 各 种 异 构 平 台 的 基 
础 上 构筑 一 个 通用 的 平台 无 关 、 语 言 无 关 的 技术 层 , 各 种 不 同 平台 之 上 的 应 用 可 以 依靠 这 个 
技术 层 来 实施 彼此 的 连接 和 集成 。 

(2) 自 描述 能 力 。Web 服务 的 所 有 协议 ,包括 SOAP、WSDL、UDDI 都 是 XML 文档 ， 
所 以 Web 服务 具有 自 描述 的 良好 性 质 。 

(3) 松 耦 合 性 。 当 一 个 Web 服务 的 实现 发 生变 更 时 ,调用 者 是 不 会 感到 这 一 点 的 。 对 
于 调用 者 来 说 ,只 要 Web 服务 的 调用 接口 不 变 , Web 服务 实现 的 任何 变更 对 他 们 来 说 都 是 
不 透明 的 ,甚至 当 Web 服务 的 实现 平台 从 J2EE 迁移 到 .NET 或 者 是 相反 的 迁移 流程 ,用 
户 都 一 无 所 知 。 

(4) 易于 集成 。 由 于 Web 服务 采用 简单 的 、 易 理解 的 标准 Web 协议 作为 组 件 界面 描 
述 和 协同 描述 规范 ,完全 屏蔽 了 不 同 软件 平台 的 差异 ,无论 是 CORBA、DCOM 还 是 EJB, 都 
可 以 通过 这 一 种 标准 的 协议 进行 互 操作 ,实现 了 在 当前 环境 下 最 高 的 可 集成 性 。 

(5) 用 消息 传递 代替 传统 的 APIs。Web 服务 采用 了 SOAP。SOAP 独立 于 平台 ,可 以 
在 不 同 的 平台 、 环 境 下 进行 传递 和 交互 。 

Web Service 是 组 件 技术 在 Internet 中 的 延伸 ,从 本 质 上 讲 是 放置 于 网 络 上 的 可 重用 构 
件 。 从 更 高 的 概念 层面 讲 , 可 以 将 Web 服务 视 为 一 些 工作 单元 ,每 个 单元 处 理 特定 的 功能 
任务 。 再 往 上 一 步 ,可 以 将 这 些 任 务 组 合成 面向 业务 的 任务 ,以 处 理 特 定 的 业务 操作 任务 ， 
从 而 使 非 技 术 人 员 去 考虑 一 些 应 用 程序 ,这 些 应 用 程序 可 以 在 Web 服务 应 用 程序 工作 流 中 
一 起 处 理 业务 问题 。 因 此 ,一 旦 由 技术 人 员 设 计 并 构建 好 Web 服务 之 后 ,业务 流程 架构 设 
计 师 可 以 聚集 这 些 Web 服务 来 解决 业务 层面 的 问题 。 
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(人 Web 应 用 与 发 展 趋势 


Web, 这 个 由 无 以 计数 的 超 链 接 形 成 的 网 络 世界 ,在 给 每 一 个 人 的 工作 、 学 习 、 生 活 和 娱 
乐 带 来 无 穷 的 便利 和 全 新 的 生命 体验 的 同时 ,新 的 技术 、 新 的 理念 .新 的 应 用 不 断 出 现 ,又 让 
人 们 对 Web 的 未 来 充满 了 无 限 的 遐想 。 


1.5.1 浏览 器 /服务 器 计算 模式 


在 Web 出 现 以 前 ,计算 机 的 应 用 模式 经 历 了 单机 应 用 到 网 络 应 用 两 个 阶段 ,这 些 不 同 
的 计算 模式 有 各 自 的 优点 和 不 足 。Web 的 出 现 使 得 一 种 围绕 Web 服务 的 计算 模式 成 为 当 
前 计算 机 应 用 的 主流 模式 ,并 推动 了 软件 开发 .软件 应 用 、 应 用 集成 方式 的 重大 改变 。 


1. 集中 式 计算 模式 


在 计算 机 诞生 和 应 用 的 初期 ,计算 所 需要 的 数据 和 程序 都 是 集中 在 一 台 计 算 机 上 进行 
的 , 称 为 集中 式 计算 。 随 着 网 络 的 发 展 ,这 种 集中 式 计 算 往往 形成 一 种 由 大 型 机 和 多 个 与 之 
相连 的 终端 组 成 的 网 络 结构 。 当 支持 大 量 用 户 时 ,大 型 机 自 顶 向 下 的 维护 和 管理 方式 显示 
出 集中 式 处 理 的 优越 性 。 它 具有 安全 性 好 、 可 靠 性 高 .计算 能 力 和 数据 存储 能 力 强 以 及 系统 
维护 和 管理 的 费用 较 低 等 优点 。 但 它 也 存在 着 一 些 明 显 的 缺点 ,如 大 型 机 的 初始 投资 较 大 、 
可 移植 性 差 .资源 利用 率 低 以 及 网 络 负载 大 等 。 


2. 客户 机 /服务 器 (C/S) 计 算 模式 


随 着 微型 计算 机 和 网 络 的 发 展 , 数 据 和 应 用 逐渐 转向 了 分 布 式 , 即 数据 和 应 用 程序 跨越 
多 个 节点 机 ,形成 了 新 的 计算 模式 ,这 就 是 客户 机 /服务 器 (Client/Server,C/S) 计 算 模式 。 
C/S 模 式 是 一 种 典型 的 两 层 计 算 模 式 , 它 将 应 用 一 分 为 二 : 前 端 是 客户 机 ,一 般 使 用 微型 计 
算 机 ,几乎 所 有 的 应 用 逮 辑 都 在 客户 端 进行 和 表达 ,客户 机 完成 与 用 户 的 交互 任务 ,具有 稳 
健 的 数据 操纵 和 事务 处 理 能 力 ; 后 端 是 服务 器 ,可 以 使 用 各 种 类 型 的 主机 ,服务 器 负责 数据 
管理 ,提供 数据 库 的 查询 和 管理 ,大 规模 的 计算 等 服务 。 

C/S 计算 模式 具有 以 下 优点 : 通过 异种 平台 集成 ,能 够 协调 现 有 的 各 种 IT 基础 结构 ; 
分 布 式 管理 ; 能 充分 发 挥 客户 端 PC 的 处 理 能 力 ; 安全 、 稳 定 、 速 度 快 ; 可 脱 机 操作 。 但 随 
着 应 用 规模 的 日 益 扩 大 ,应 用 程序 的 复杂 程度 不 断 提高 ,C/S 结构 逐渐 暴露 出 许多 缺点 , 主 
要 包括 : 它 必须 在 客户 端 安装 大 量 的 应 用 程序 (客户 端 软件 ) ,开发 成 本 较 高 ,移植 困难 ,用 
户 界面 风格 不 统一 ,使 用 繁杂 ,不 利于 推广 使 用 ,维护 复杂 ,升级 麻烦 ,信息 内 容 和 形式 单一 ， 
新 技术 不 能 轻易 应 用 等 。 


3. 浏览 器 /服务 器 (B/S) 计 算 模式 


随 着 Web 的 出 现 , 客 户 机 /服务 器 模式 表现 出 许多 不 足 ,特别 是 “ 胖 ” 客 户 机 和 对 局 域 网 
的 依赖 ,已 经 不 能 适应 Web 的 发 展 。 人 们 需要 利用 互联 网 ,将 应 用 分 布 到 整个 Web 中 ,而 
不 是 局 限于 企业 局 域 网 内 部 ,这 就 导致 了 一 种 更 加 灵活 的 多 级 分 布 式 计算 模式 , 即 浏览 器 / 
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服务 器 (Browser/Server,B/S) 模 式 的 产生 和 发 展 。 
浏览 器 /服务 器 计算 模式 是 一 种 基于 Web 的 协同 计算 ,是 一 种 三 层 架 构 “ 瘦 ”客户 机 / 服 
务 器 计算 模式 ,概念 模型 如 图 1-5 所 示 。 


HTTP 请 求 HTTP 请 求 

Web Web le 数据 库 Pe 
浏览 器 服务 器 服务 器 

HTML 或 HTML 或 

XML 文档 XML 文档 


图 1-5 B/S 三 层 架构 计算 模式 概念 模型 


第 一 层 为 客户 端 表示 层 ,与 C/S 结构 中 的 “ 胖 ” 客 户 端 不 同 ,三 层 架 构 中 的 客户 层 只 保 
留 一 个 Web 浏览 器 ,不 存放 任何 应 用 程序 ,其 运行 代码 可 以 从 位 于 第 二 层 的 Web 服务 器 下 
载 到 本 地 的 浏览 器 中 执行 ,几乎 不 需要 任何 管理 工作 ,是 一 种 “ 瘦 " 客 户 机 。 第 二 层 是 应 用 服 
务 器 层 , 由 一 人 台 或 多 台 Web 服务 器 组 成 ,处 理应 用 中 的 所 有 业务 多 辑 ` 对 数据 库 的 访问 等 工 
作 。 该 层 具 有 良好 的 可 扩充 性 ,程序 的 部 署 和 管理 主要 在 Web 服务 器 上 进行 ,相对 于 C/S 
而 言 无 论 是 工作 的 复杂 性 还 是 工作 量 都 大 大 减少 。 第 三 层 是 数据 中 心 层 ,安装 数据 库 服务 
器 ,负责 整个 应 用 中 的 数据 管理 。 

B/S 计算 模式 与 传统 的 C/S 结构 相 比 体现 了 集中 式 计算 的 优越 性 : 具有 良好 的 开放 
性 ,利用 单一 的 访问 点 ,用 户 可 以 在 任何 地 点 使 用 系统 ; 用 户 可 以 跨 平台 以 相同 的 浏览 器 界 
面 访问 系统 ; 因为 在 客户 端 只 需要 安装 浏览 器 ,基本 上 取消 了 客户 端的 维护 工作 ,有 效 地 减 
少 了 整个 系统 的 运行 和 维护 成 本 。 

目前 , 绝 大 多 数 的 计算 机 应 用 都 是 部 署 在 Internet 上 ,例如 各 种 各 样 的 电子 商务 平台 、 
企业 和 政府 部 门 的 业务 系统 等 ,大 都 使 用 了 B/S 结构 。 从 应 用 的 角度 讲 , 用 户 使 用 系统 ,就 
是 通过 Web 浏览 器 访问 Web 应 用 系统 (网 站 ) 的 过 程 。 访 问 的 基本 流程 如 下 。 

(1) 在 用 户 端 ,在 浏览 器 地 址 栏 中 ,用 户 输入 要 访问 的 网 页 网 址 URL, 按 Enter 键 。 

(2) Web 服务 器 收 到 用 户 的 HTTP 请 求 ,根据 URL 中 指定 的 路 径 和 网 页 文件 , 调 出 相 
应 的 网 页 文件 。 如 果 用 户 要 浏览 的 页 面 是 普通 的 html 页 面 , Web 服务 器 将 把 该 页 面 直接 
发 送 给 用 户 。 如 果 是 服务 器 页 (如 jsp asp 等 ),Web 服务 器 将 把 该 页 面 交 给 应 用 服务 器 (如 
Tomcat) ,由 应 用 服务 器 执行 页 面 中 的 服务 器 脚本 程序 ,执行 完 后 ,将 页 面 返 给 Web 服务 
器 , Web 服务 器 再 将 页 面 发 送 到 用 户 端 。 

(3) 在 用 户 端 , Web 服务 器 返回 的 文档 在 浏览 器 中 打开 , 即 完成 网 页 浏览 。 


1.5.2 SOA 软件 设计 模式 


从 计算 机 诞生 到 现在 ,计算 机 硬件 技术 在 发 展 的 同时 ,计算 机 软件 也 在 悄悄 地 发 生变 
化 。 这 种 变化 不 仅 表现 在 计算 机 软件 的 内 涵 、 应 用 方式 上 ,同时 也 表现 在 软件 的 设计 模式 和 
开发 方法 上 。 软 件 开发 思想 的 演化 ,使 得 在 Web 流行 的 今天 ,推动 了 面向 服务 的 体系 架构 
SOA 的 产生 和 发 展 ,使 其 成 为 下 一 代 软 件 体系 架构 的 主流 。 


1. 软件 体系 架构 设计 与 开发 模式 的 演化 过 程 
软件 开发 人 员 往 往 希 望 软件 开发 能 够 满足 对 于 开发 效率 、 可 靠 性 、 易 维护 性 、 易 管理 等 
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多 方面 的 更 高 要 求 。 无 论 在 计算 机 发 展 的 哪 一 个 时 期 ,这 都 是 软件 开发 人 员 永 恒 的 目标 。 
可 以 把 这 种 目标 的 实现 分 成 以 下 几 个 阶段 。 

1) 模块 化 体系 结构 设计 和 结构 化 编程 

在 计算 机 诞生 的 初期 ,程序 规模 很 小 ,基本 上 谈 不 上 程序 系统 机 构 。 直 到 20 世纪 70、 
80 年 代 , 随 着 软件 规模 的 不 断 扩 大 ,软件 工程 的 概念 开始 出 现 。 为 了 应 对 软件 系统 规模 的 
不 断 扩大 ,人 们 开始 考虑 软件 系统 的 体系 结构 问题 ,结构 化 编程 思想 开始 兴起 ,出 现 了 子 程 
序 、 函 数 的 概念 。 此 时 ,各 种 各 样 的 开发 环境 也 不 断 出 现 , 软 件 开 发 进入 一 种 标准 函数 ,用户 
自 定义 函数 ,实现 了 一 种 代码 级 的 重用 ,有 效 地 提高 了 软件 系统 的 开发 效率 ,提高 了 代码 质 
量 。 在 这 一 时 期 ,软件 开发 模式 、 软 件 工程 的 思想 日 益 融 入 到 软件 设计 和 开发 人 员 中 ,出 现 
了 软件 的 生命 周期 开发 模式 、 原 型 法 开发 模式 等 不 同 的 软件 开发 模式 。 

生命 周期 开发 模式 又 称 软件 开发 瀑布 模型 ,是 面向 功能 或 过 程 的 软件 开发 方法 。 它 将 
软件 开发 分 成 几 个 阶段 : 用 户 需求 分 析 , 开 发 人 员 和 业务 人 员 交 流 , 制 定 用 户 需 求 说 明 
书 ; @ 系 统 设计 ,开发 人 员 根 据 需 求 说 明 书 进行 系统 设计 ,制定 系统 设计 报告 ; 加 系统 开 
发 ,根据 系统 设计 报告 ,进行 系统 编码 ; @ 系 统 测试 ,系统 实现 后 双方 组 织 人 员 进 行 测试 ; 
@ 运 行 与 维护 ,系统 测试 结束 后 , 便 进入 系统 的 运行 .维护 期 。 

从 理论 上 讲 , 软 件 开发 的 生命 周期 模式 是 非常 科学 的 ,但 是 利用 生命 周期 模式 开发 系统 
基于 两 个 假设 : 中 用 户 能 够 清楚 地 、 完 整地 提供 系统 要 求 ; 四 开发 者 能 完整 地 .严格 地 理解 
和 定义 要 求 。 但 在 实际 开发 中 ,这 两 个 假设 是 很 难 满足 的 。 因 为 ,首先 ,在 开发 初期 ,用 户 很 
难 清楚 地 描述 系统 需求 ,或 者 系统 需求 将 来 可 能 发 生 较 大 变化 ; 其 次 ,开发 人 员 和 业务 人 员 
在 交流 时 可 能 存在 理解 上 的 不 一 致 ,其 结果 是 系统 开发 完毕 后 ,不 能 很 好 地 满足 用 户 需求 。 
生命 周期 模式 是 封闭 式 的 ,缺少 灵活 性 ,特别 是 在 用 户 需求 定义 方面 。 

面向 过 程 的 生命 周期 法 主要 流行 于 20 世纪 80 年 代 , 直 到 现在 ,这 种 思想 一 直 还 对 软件 
设计 和 开发 人 员 有 着 很 深 的 影响 。 

和 生命 周期 模式 不 同 , 原 型 法 开发 模式 要 求 经 过 对 用 户 需求 的 简单 快速 分 析 , 利 用 高 级 
开发 工具 及 环境 ,快速 完成 原型 系统 的 设计 和 实施 ,提供 给 用 户 评价 。 一 个 原型 系统 就 是 系 
统 的 一 个 可 运行 的 早期 版 本 , 它 反映 了 最 终 系 统 的 部 分 重要 特征 ,在 评价 过 程 中 ,开发 人 员 
不 断 从 用 户 那里 得 到 反馈 信息 ,修正 原型 的 用 户 需求 定义 ,进而 对 原型 系统 作 相应 改进 , 逐 
步 减 少 分 析 与 交互 过 程 中 的 误解 ,弥补 遗漏 ,从 而 提高 最 终 系 统 的 质量 。 

原型 法 的 核心 是 用 交互 ,快速 建立 起 来 的 原型 取代 形式 、 不 易 修改 的 大 块 的 规格 说 明 ， 
用 户 通过 在 计算 机 上 实际 运行 和 试用 原型 而 向 开发 者 提供 真实 的 反馈 意见 。 原 型 法 开发 模 
式 的 实现 得 益 于 面向 对 象 的 语言 (Smalltalk、C++ 、Java 等) 和 可 视 化 的 第 四 代 开 发 工具 的 出 
现 。 从 宏观 上 讲 , 原 型 法 比 生命 周 期 法 更 实用 ,但 是 ,在 每 一 个 原型 的 设计 和 开发 过 程 中 ,都 
离 不 开 生 命 周期 的 科学 思想 。 

在 软件 工程 的 实践 中 ,生命 周期 法 和 原型 法 的 有 效 结合 表现 出 了 强大 的 生命 力 和 可 操 
作 性 。 这 种 结合 就 是 整个 软件 的 开发 表现 为 一 个 个 原型 的 向 前 推进 ,在 每 一 个 原型 的 内 部 ， 
又 是 按照 生命 周期 的 思想 来 设计 。 

2) 基于 组 件 的 软件 体系 架构 与 面向 对 象 (组 件 ) 开 发 模式 

进入 20 世纪 90 年 代 , 随 着 网 络 的 发 展 和 软件 开发 规模 的 扩大 ,在 涉及 分 布 式 、 异 构 等 
复杂 特征 的 环境 中 ,代码 级 别 的 重用 性 差 \ 可 维护 性 差 .效率 低 的 弱点 是 不 可 逾越 的 ,因此 人 
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们 以 架构 运行 环境 (如 .Net、J2EE 等 ) 来 提供 完善 的 支撑 平台 ,从 而 把 开发 者 解放 出 来 ,使 其 
更 专注 于 业务 核心 的 开发 。 而 这 些 业 务 功能 以 组 件 的 形式 (DCOM、EJB 等 ) 发 布 运行 在 架 
构 运 行 环境 中 ,软件 开发 的 重用 模式 也 上 升 到 业务 组 件 的 级 别 。 

1991 年 ,对 象 管理 组 织 (OMG) 发 布 了 公共 对 象 请 求 代理 体系 结构 (CORBA) , 它 是 一 
种 标准 的 面向 对 象 应 用 程序 体系 规范 ,由 对 象 请 求 代 理 (Object Request Broker,ORB) 、 对 
象 服务 .公共 设施 、 域 接口 和 应 用 接口 几 个 部 分 组 成 ,核心 部 分 是 ORB。ORB 提供 了 一 种 
机 制 ,通过 这 种 机 制 , 对 象 可 以 透明 地 发 出 请 求 和 接收 响应 。 分 布 的 ` 可 以 互 操作 的 对 象 可 
以 利用 ORB 构造 可 以 互 操作 的 应 用 。ORB 可 看 做 在 对 象 之 间 建 立 客户 /服务 关系 的 一 种 
中 间 件 。 基 于 ORB, 客 户 可 以 透明 地 调用 服务 对 象 提 供 的 方法 ,该 服务 对 象 可 以 与 客户 机 
运行 在 同一 台 机 器 上 ,也 可 以 运行 在 其 他 机 器 上 通过 网 络 与 客户 进行 交互 。ORB 截取 客户 
发 送 的 请 求 , 并 负责 在 该 软件 总 线 上 找到 实现 该 请 求 的 服务 对 象 , 然 后 完成 参数 、 方 法 调用 ， 
并 返回 最 终结 果 。 

CORBA 可 以 看 做 一 种 软件 总 线 , 它 希望 一 个 用 户 的 软件 系统 是 由 运行 在 CORBA 之 
上 的 一 个 个 独立 的 软件 组 件 对 象 构 成 。 由 于 缺少 企业 协议 的 支持 ,或 者 说 协议 的 研发 未 能 
跟 上 ,CORBA 的 思想 实现 得 并 不 理想 , 随 着 Web 服务 的 出 现 ,CORBA 结构 逐渐 淡出 。 

1993 年 ,为 解决 代码 的 共享 问题 ,微软 公司 提出 了 组 件 对 象 模型 (Component Object 
Model,COM) 。 对 于 二 进 制 代码 的 重用 ,最早 是 动态 链接 库 (Dynamic Link Library,DLL)， 
就 为 了 动态 调用 功能 而 提出 的 ,是 一 些 函 数 的 堆砌 。COM 是 一 种 组 件 技术 ,拥有 状态 、 事 
件 的 概念 ,多 个 方法 可 以 配合 工作 。COM 组 件 是 遵循 COM 规范 编写 ,以 Win32 动态 链接 
库 (DLL) 或 可 执行 文件 (EXE) 形 式 发 布 的 可 执行 二 进 制 代码 ,能 够 满足 对 组 件 架 构 的 所 有 
需求 。 遵 循 COM 的 规范 标准 ,组 件 与 应 用 、 组 件 与 组 件 之 间 可 以 互 操作 ,可 极其 方便 地 建 
立 可 伸缩 的 应 用 系统 。COM 是 一 种 技术 标准 ,其 商业 品牌 称 为 ActiveX。 

1996 年 ,为 了 解决 分 布 应 用 问题 ,微软 提出 了 分 布 式 组 件 对 象 模型 (Distributed 
Component Object Model,DCOM) , 它 扩展 了 COM 的 功能 ,使 其 支持 不 同 计算 机 上 对 象 之 
间 的 通信 。DCOM 处 理 网 络 协议 的 低层 次 的 细节 问题 ,而 不 必 关 心太 多 的 网 络 协议 细节 ， 
从 而 使 用 户 能 够 集中 精力 解决 问题 。DCOM 位 于 应 用 程序 的 组 件 之 间 , 将 组 件 以 不 可 见 的 
方式 胶合 在 一 起 组 成 具有 完整 功能 的 应 用 程序 。 

在 微软 的 系统 上 ,COM/DCOM 发 挥 了 应 有 的 作用 ,但 是 Internet 是 存在 巨大 异 构 的 环 
境 , 进 入 2000 年 后 , 随 着 SOA 架构 的 兴起 .COM/DCOM 技术 也 进入 尾声 。 

3) 面向 服务 体系 架构 (SOA) 与 面向 方面 编程 (AOP) 

当 软 件 的 使 用 范围 扩展 到 更 广阔 的 范围 ,往往 会 面 对 更 加 复杂 的 IT 环境 和 更 加 灵活 
多 变 的 需求 。 服 务 (Service) 的 概念 出 现 了 ,人 们 将 应 用 (Application) 以 业务 服务 (Business 
Service) 的 形式 公布 出 来 供 别 人 使 用 ,而 完全 不 需要 去 考虑 这 些 业务 服务 运行 在 哪 一 个 架 
构 体 系 上 ,因为 所 有 的 服务 都 讲 着 同样 的 语言 。 此 时 XML、Web Service 等 技术 的 发 展 推动 
了 SOA 架构 的 形成 和 发 展 。 

从 技术 的 角度 理解 ,面向 服务 体系 架构 (Service-Oriented Architecture,SOA) 是 构造 分 
布 式 系统 的 方法 , 它 将 应 用 程序 功能 作为 服务 发 送 给 最 终 用 户 或 者 其 他 服务 。SOA 具有 可 
重用 、 模 块 化 和 松 耦 合 的 特征 。 从 业务 的 角度 理解 ,将 服务 编排 成 各 种 业务 系统 ,将 业务 逻 
辑 用 服务 体现 出 来 。SOA 体系 架构 可 以 应 用 在 软件 架构 设计 和 应 用 集成 两 个 不 同 的 层面 。 
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SOA 同样 也 强调 重用 (Reuse) ,但 是 相对 于 传统 的 代码 重用 、 对 象 重 用 和 部 件 重用 ， 
SOA 的 重用 粒度 更 粗 。SOA 的 核心 体现 在 企业 应 用 或 者 业务 功能 上 的 “重用 ”和 “ 互 操 
作 ”,SOA 的 重用 在 于 业务 级 的 应 用 , 即 服务 的 重用 ,而 不 再 把 IT 与 业务 对 立 起 来 ,这 可 以 
被 视 为 在 IT 驱动 业务 的 方向 上 迈 出 的 重要 一 步 。 

在 SOA 架构 下 ,出 现 了 面向 方面 编程 (Aspect Oriented Programming, AOP) 模 式 ， 
AOP 是 OOP 的 延续 ,设计 模式 追求 的 是 调用 者 和 被 调用 者 之 间 的 解 看 ,AOP 可 以 说 也 是 
这 种 目标 的 一 种 实现 。AOP 使 原本 复杂 的 调用 与 被 调用 和 错综复杂 的 耦合 关系 变 得 清晰 ， 
使 程序 的 整体 架构 保持 高 内 聚 、 低 耦合 ,这 对 于 一 个 大 型 复杂 系统 来 说 是 非常 重要 的 。 


2. SOA 的 设计 思想 


SOA 是 软件 体系 架构 的 下 一 代 发 展 方向 。SOA 以 可 重用 、 模 块 化 和 松 耦 合 为 特征 ,将 
业务 逻辑 用 服务 体现 出 来 。SOA 体系 架构 可 以 应 用 在 应 用 集成 和 软件 架构 设计 两 个 不 同 
的 层面 。 

首先 ,从 设计 思路 上 看 ,SOA 并 不 是 一 个 新 的 概念 ,CORBA 的 出 发 点 同样 也 是 实现 类 
似 的 目标 ,但 是 由 于 标准 、 中 间 件 以 及 API 的 欠缺 ,使 得 CORBA 技术 只 能 纸上谈兵 。 今 
天 ,企业 应 用 集成 的 迫切 需求 使 得 SOA 再 一 次 被 提 到 前 台 , 但 是 今天 的 SOA 已 经 与 以 往 
CORBA 时 代 所 面临 的 环境 大 不 相同 了 ,其 中 最 为 核心 的 技术 一 一 Web 服务 已 经 拥有 了 一 
系列 标准 , WSDL、UDDI 等 标准 都 已 经 被 融入 到 了 各 厂商 的 产品 之 中 ,为 SOA 的 实现 葛 定 
了 技术 基础 ,使 SOA 技术 的 实现 与 应 用 成 为 可 能 ,也 成 为 SOA 软件 集成 技术 快速 发 展 的 
动力 ,使 SOA 进入 主流 软件 集成 技术 体系 。 

此 外 ,SOA 技术 的 逐步 成 熟 ,不 仅 将 深刻 改变 软件 集成 的 体系 架构 和 工作 方法 ,同时 ， 
也 将 彻底 改变 软件 开发 的 思想 、 架 构 和 工作 方法 。 

SOA 是 一 种 思想 .模式 和 体系 , 它 规范 了 在 软件 架构 以 及 系统 集成 中 的 方法 ,其 思想 的 
表现 就 是 将 业务 逻辑 和 功能 分 解 成 更 小 的 独立 多 辑 和 功能 单元 。 通 过 聚合 技术 ,将 这 些 单 
元 构建 成 一 个 较 大 的 业务 逻辑 单元 ,从 而 实现 服务 的 独立 存在 ,通过 标准 技术 ,使 服务 保持 
足够 的 共性 ,实现 系统 的 体系 化 。 

由 IBM 公司 提案 ,国际 开放 群 组 (The Open Group) 提 出 了 一 个 SOA 架构 的 参考 模 
型 ,这 个 架构 框架 目前 是 产业 界 最 权威 和 严谨 的 SOA 架构 标准 。SOA 标准 模型 的 组 成 部 
分 包括 基础 设施 服务 、 企 业 服 务 总 线 、 关 键 服务 组 件 、 开 发 工具 和 管理 工具 ,如 图 1-6 所 示 。 


开发 工具 | ( 交互 服务 】 | 流程 服务 】 ( 信息 服务 】 | 管理 工具 


(提供 实现 构件 级 框架 及 基础 公共 服务 ) 


= 要 

Ee | 企业 服务 吕 缀 2 
: hi 邵 

下 (服务 注册 、 调 用 、 路 由 、 事 件 框架 ) pr 

国务 下 实 人 伙伴 服务 】 [企业 应 用 服务 】 ( 接 入 服务 ] 下 间 

服务 组 装 | 基础 设施 服务 | 部 入 


图 1-6 ”SOA 标准 模型 
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上 述 SOA 体系 架构 反映 出 基于 SOA 的 软件 设计 模式 和 设计 思想 与 传统 的 软件 体系 
架构 的 不 同 。 在 该 体系 架构 下 ,利用 服务 管理 工具 集 , 开 发 工具 集 ,把 最 基本 的 共性 业务 抽 
象 出 来 ,封装 为 一 个 个 基础 服务 ,建立 基础 共性 服务 库 。 利 用 业务 流程 管理 工具 集 , 实 现 业 
务 流程 的 定制 和 编排 。 完 成 后 的 服务 在 服务 容器 中 通过 服务 总 线 进行 协同 。 


3. SOA 的 生命 周期 


由 于 SOA 涉及 业务 的 诸多 方面 ,因此 需要 从 一 开始 就 对 SOA 项 目 进行 细心 的 规划 和 
设计 。 

(1) 建 模 (Model) 。SOA 项 目的 第 一 步 几乎 和 技术 没有 任何 关系 ,所 有 事项 都 与 用 户 
的 业务 相关 。 面 向 服务 的 方法 将 业务 所 执行 的 活动 视 为 服务 ,因此 第 一 步 是 要 确定 这 些 业 
务 活 动 或 流程 实际 是 什么 。 对 用 户 的 业务 体系 结构 进行 记录 ,这 些 记 录 不 仅 可 以 用 于 规划 
SOA ,还 可 以 用 于 对 实际 业务 流程 进行 优化 。 通 过 在 编写 代码 前 模拟 或 建 模 业务 流程 ,可 
以 更 深入 地 了 解 这 些 流程 ,从 而 有 利于 构建 帮助 执行 这 些 流程 的 软件 。 

建 模 业务 流程 的 程度 将 依赖 于 预期 实现 的 深度 。 对 于 企业 架构 师 , 需 要 对 实际 的 业务 
服务 进行 建 模 。 对 于 软件 开发 人 员 ,可 能 对 单个 服务 进行 建 模 。 

(2) 组 装 (Assemble) 。 对 业务 流程 进行 建 模 和 优化 后 ,开发 人 员 可 以 开始 构建 新 的 服 
务 和 /或 重用 现 有 的 服务 ,然后 对 其 进行 组 装 以 形成 组 合 应 用 程序 ,从 而 实现 这 些 流 程 。 在 
建 模 步 骤 中 ,已 经 确定 了 需要 何 种 类 型 的 服务 以 及 它们 将 访问 何 种 类 型 的 数据 。 已 经 存在 
某 种 形式 的 实现 这 些 服务 或 访问 该 类 数据 所 需 的 一 些 软件 。 组 装 步骤 将 要 找到 已 经 存在 的 
功能 ,并 为 其 添加 服务 支持 。 另 外 ,还 涉及 创建 提供 功能 和 访问 数据 源 所 需 的 新 服务 ,以便 
满足 用 户 的 SOA 涉及 的 业务 流程 范围 内 的 需求 。 

(3) 部 署 (Deploy)。 进 行 建 模 和 组 装 后 ,要 将 组 成 SOA 的 资产 部 署 到 安全 的 集成 环境 
中 。 此 环境 本 身 提供 专门 化 的 服务 ,用 于 集成 业务 中 涉及 的 人 员 \ 流 程 和 信息 。 这 种 级 别 的 
集成 可 帮助 确保 将 公司 的 所 有 主要 元 素 连接 到 一 起 协同 工作 。 此 外 ,部 署 工 作 还 需要 满足 
业务 的 性 能 和 可 用 性 需求 ,并 提供 足够 的 灵活 性 ,以 便 吸纳 新 服务 ,而 不 会 对 整个 系统 造成 
大 的 影响 。 

(4) 管理 (Manage)。 部 署 后 ,需要 从 IT 和 业务 两 个 角度 对 系统 进行 管理 和 监视 。 在 
管理 步骤 中 收集 的 信息 用 于 帮助 实时 地 了 解 业务 流程 ,从 而 能 更 好 地 进行 业务 决策 ,并 将 信 
息 反馈 回 生 命 周 期 ,以 进行 持续 的 流程 改进 工作 。 在 这 期 间 , 将 需要 处 理 服 务 质 量 、 安 全 ,一 
般 系统 管理 之 类 的 问题 。 

在 本 步骤 中 ,将 监视 和 优化 系统 ,发 现 和 纠正 效率 低下 的 情况 和 存在 的 问题 。 由 于 
SOA 是 一 个 迭代 过 程 ,因此 ,在 此 步骤 中 ,不 仅 要 找 出 技术 体系 结构 中 有 待 改进 之 处 ,而 且 
还 要 找 出 业务 体系 结构 中 有 待 改 进 之 处 。 

完成 此 步骤 后 就 要 开始 新 的 “ 建 模 ”步骤 了 。 在 “管理 ”步骤 中 收集 的 数据 将 用 于 重复 整 
个 SOA 生命 周期 ,再 次 进行 整个 过 程 。 

(5) 控制 (Government & Processes)。SOA 是 一 种 集中 系统 ,其 中 可 以 包含 来 自 组 织 
不 同 部 门 的 服务 ,甚至 还 能 包含 来 自 组 织 外 的 服务 。 如 果 没 有 恰当 的 控制 ,这 种 系统 很 容易 
失控 。 控 制 对 所 有 生命 周期 阶段 起 到 巩固 、 支 撑 作 用 ,为 整个 SOA 系统 提供 指导 ,并 有 助 
于 了 解 系统 全 貌 。 它 提供 指导 和 控制 ,帮助 服务 提供 者 和 使 用 者 避免 遇 到 意外 情况 。 
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4. 企业 服务 总 线 


企业 服务 总 线 (Enterprise Service Bus,ESB) 是 SOA 基础 架构 的 关键 组 件 ,是 SOA 架 
构 的 一 个 支柱 技术 。 作 为 一 种 消息 代理 架构 , 它 提 供 消息 队列 系统 ,使 用 诸如 SOAP 或 
JMS (Java Message Service) 等 标准 技术 来 实现 。 有 人 把 ESB 描述 成 一 种 开放 的 、 基 于 标准 
的 消息 机 制 , 通 过 简单 的 标准 适配器 和 接口 ,来 完成 粗 粒 度 应 用 (比如 服务 ) 和 其 他 组 件 之 间 
的 互 操作 。 

在 SOA 体系 架构 中 ,企业 服务 总 线 (ESB) 提 供 了 服务 管理 的 方法 和 在 分 布 式 异 构 环 境 
中 进行 服务 交互 的 功能 ,通过 ESB, 实 现 服务 的 部 署 . 配 置 .注册 、 消 息 处 理 、 消 息 路 由 、 交 
互 、 事 件 侦 听 、 执 行 、 服 务 质量 和 服务 级 别管 理 等 。ESB 由 中 间 件 技术 实现 并 作为 支持 SOA 
的 一 组 基础 架构 ,支持 异 构 环境 中 的 服务 、 消 息 以 及 基于 事件 的 交互 ,并 且 具 有 适当 的 服务 
级 别 和 可 管理 性 。 


5. SOA 的 特征 


面向 服务 的 体系 架构 SOA 具有 如 下 特征 。 

(1) 服务 的 封装 (Encapsulation) 。 把 服务 封装 成 可 以 被 不 同业 务 流程 重复 使 用 的 业务 
组 件 , 它 隐藏 所 有 实现 细节 ,不管 服务 内 部 如 何 修改 ,使 用 什么 平台 、 什 么 语言 ,只 要 保持 接 
口 不 变 ,就 不 会 影响 最 终 用 户 的 使 用 。 

(2) 服务 的 重用 (Reuse) 。 一 个 服务 是 一 个 独立 的 实体 ,与 底层 实现 和 用 户 的 需求 完全 
无 关 , 极 大 地 方便 了 服务 的 重复 使 用 ,从 而 降低 了 开发 成 本 。 

(3) 服务 的 互 操作 (Interoperability) 。 互 操作 并 不 是 一 个 新 概念 ,在 CORBA、DCOM 、 
Web Service 中 就 已 经 采用 互 操作 技术 了 。 在 SOA 中 ,通过 服务 之 间 既 定 的 通信 协议 进行 
互 操作 。 主 要 有 同步 和 异步 两 种 通信 机 制 。SOA 提供 服务 的 互 操作 特性 更 利于 其 在 多 个 
场合 被 重用 。 

(4) 服务 是 自治 的 (Autonomous) 功 能 实体 。 服 务 是 由 组 件 组 成 的 组 合 模块 ,是 自 包含 
和 模块 化 的 。SOA 非常 强调 架构 中 提供 服务 的 功能 实体 的 完全 独立 自主 的 能 力 。 传 统 的 
组 件 技术 ,如 .NET Remoting、EJB、COM 或 者 CORBA, 都 需要 有 一 个 宿主 (Host 或 者 
Server) 来 存放 和 管理 这 些 功能 实体 ; 当 这 些 宿主 运行 结束 时 这 些 组 件 的 寿命 也 随 之 结束 。 
这 样 当 宿主 本 身 或 者 其 他 功能 部 分 出 现 问题 的 时 候 , 在 该 宿主 上 运行 的 其 他 应 用 服务 就 会 
受到 影响 。 

在 SOA 架构 中 ,非常 强调 实体 自我 管理 和 恢复 能 力 。 常 见 的 用 来 进行 自我 恢复 的 技 
术 , 比 如 事务 (Transaction) 处 理 、 消 息 队 列 (Message Queue)、 宛 余部 署 (Redundant 
Deployment) 和 集群 (Cluster) 系统 在 SOA 中 都 起 到 至 关 重 要 的 作用 。 

(5) 服务 之 间 的 松 看 合 度 (Loosly Coupled) 。 服 务 请 求 者 到 服务 提供 者 的 绑 定 与 服务 
之 间 应 该 是 松 耦 合 的 。 这 就 意味 着 ,服务 请 求 者 不 知道 服务 提供 者 实现 的 技术 细节 ,比如 程 
序 设计 语言 .部署 平台 等 。 服 务 请 求 者 往往 通过 消息 调用 操作 ,请 求 消息 和 响应 ,而 不 是 通 
过 使 用 API 和 文件 格式 。 这 个 松 耦 合 使 会 话 一 端的 软件 可 以 在 不 影响 另 一 端的 情况 下 发 
生 改 变 , 前 提 是 消息 模式 保持 不 变 。 

(6) 服务 是 位 置 透明 的 (Location Transparency) 。 服 务 是 针对 业务 需求 设计 的 。 需 要 
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反映 需求 的 变化 , 即 所 谓 敏 捷 (Agility) 设 计 。 要 想 真 正 实现 业务 与 服务 的 分 离 。 就 必须 使 
服务 的 设计 和 部 署 对 用 户 来 说 是 完全 透明 的 。 也 就 是 说 ,用 户 完全 不 必 知 道 响应 自己 需求 
的 服务 的 位 置 ,甚至 不 必 知 道具 体 是 哪个 服务 参与 了 响应 。 

SOA 的 灵活 性 将 给 企业 带 来 巨大 的 好 处 。 如 果 把 企业 的 IT 架构 抽象 出 来 ,将 其 功能 
以 粗 粒 度 的 服务 形式 表示 出 来 ,每 种 服务 都 清晰 地 表示 其 业务 价值 ,那么 ,这 些 服务 的 顾客 
就 可 以 得 到 这 些 服务 ,而 不 必 考虑 其 后 台 实 现 的 具体 技术 。 

基于 以 上 特征 ,只 要 将 Web Service 置 人 特定 的 企业 服务 总 线 , 就 可 以 任意 使 用 它 。 


6. SOA 和 Web 服务 的 关系 


Web 服务 与 SOA 有 着 很 多 相同 的 技术 特点 ,如 基于 XML, 符 合 SOAP、WSDL 和 
UDDI 标准 等 。 但 是 ,SOA 不 同 于 Web 服务 。SOA 是 一 种 设计 原则 ,是 一 个 概念 ,是 软件 
架构 的 方法 学 ; Web 服务 则 属于 技术 规范 ,是 一 种 具体 的 实现 技术 。Web 服务 可 以 用 来 实 
现 SOA, 但 是 如 果 没 有 Web 服务 ,企业 照样 也 可 以 很 好 地 实现 SOA。 


1.5.3 语义 Web 


万 维 网 已 经 成 为 人 类 最 大 的 信息 仓库 ,而 且 各 种 语言 .各 个 知识 领域 的 内 容 还 在 源源 不 
断 地 快速 增长 。 这 些 海量 的 信息 在 给 我 们 提供 便利 的 同时 ,让 我 们 的 信息 查询 变 得 极为 困 
难 。 大 多 数 的 搜索 引擎 是 基于 关键 词 的 搜索 ,搜索 是 基于 页 面 内 容 的 , 若 不 是 基于 页 面 内 容 
或 页 面 信息 的 语义 , 则 查 准 率 较 低 。 人 们 需要 让 页 面 内 容 有 意义 ,从 而 提供 各 种 依靠 语义 的 
自动 化 服务 ,这 就 是 语义 Web 的 研究 动机 。 


1. 语义 Web 的 概念 


在 WWW 出 现 不 入, 人 们 就 已 经 意识 到 语义 对 于 Web 的 重要 性 。HTML 只 是 规范 了 
信息 的 显示 , 却 无 法 表达 内 容 的 含义 。 没 有 形式 化 的 网 页 内 容 , 机 器 将 无 法 实现 信息 处 理 的 
自动 化 。 只 有 将 网 页 内 容 表述 成 机 器 可 以 理解 的 格式 , Web 才 可 能 成 为 一 个 巨大 的 知识 
库 ,充分 实现 信息 的 查找 ,共享 和 重用 。 为 此 ,1998 年 ,万 维 网 的 发 明 者 蒂 姆 。 伯 纳 斯 - 李 首 
次 提出 了 语义 Web(Web Semantic) 的 概念 。 

对 于 语义 Web 的 概念 ,一 般 的 表述 是 : 语义 Web 是 当前 Web 的 一 个 扩展 ,其 中 信息 具 
有 形式 化 定义 的 语义 ,更 有 助 于 计算 机 之 间 以 及 计算 机 与 人 之 间 的 协同 工作 。 其 思想 是 使 
Web 上 的 数据 以 这 样 一 种 方式 来 定义 与 链接 ,使 其 能 够 在 各 种 不 同 的 应 用 场景 中 有 效 地 实 
现 数据 的 发 现 .自动 化 处 理 、 集 成 与 复 用 。 当 且 仅 当 Web 不 仅 成 为 人 所 共享 加 工 的 场所 ,也 
成 为 自动 化 工具 所 共享 加 工 的 场所 时 ,语义 Web 才能 实现 其 全 部 潜力 。 

语义 Web 有 很 多 突出 的 优点 ,包括 数据 集成 更 简单 .搜索 更 精确 .知识 管理 更 方便 等 ， 
语义 Web 的 含义 越 来 越 丰富 。 


2. 语义 Web 的 体系 架构 


要 实现 语义 Web ,依赖 于 三 大 关键 技术 : XML 、RDF 和 Ontology。 语 义 Web 分 层 体 系 
架构 如 图 1-7 所 示 。 
(1) Unicode 和 URI 层 。Web 内 容 采用 Unicode 字符 集 ,负责 资源 的 编码 ,统一 资源 定 
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位 符 (Uniform Resource Identifier,URI) 用 于 资源 标识 ,唯一 标识 网 络 上 的 一 个 概念 或 资 
源 。 在 语义 Web 体系 结构 中 ,该 层 是 整个 语义 


User Interface+Applications Web 的 基础 。 

Trust (2) XML 十 NS 十 XML Schema 层 。 该 层 可 以 
ee 称 为 XML 层 ,用 于 表示 数据 的 内 容 和 结构 。XML 
g | 实现 文档 的 结构 化 定义 , 即 进行 文档 形式 化 。 命 名 
Unify Logic 昌 空间 (Name Space,NS) ,由 URI 索引 确定 ,目的 是 
OmalowyrRules。 | 写 | 保证 元 素 重 明 名 而 引起 的 歧义 。XML Schema 提 
富 | 供 更 多 的 数据 类 型 ,为 XML 文档 提供 数据 校 验 机 
Ra 制 。 该 层 负责 从 语法 上 表示 数据 的 内 容 和 结构 , 实 

XML+NS+XML Schema 现 Web 内 容 和 表现 形式 的 分 离 。 
(3) RDF 十 RDF Schema 层 。 该 层 又 可 以 分 为 
RDF 层 和 RDF Schema 层 , 其 中 RDF 用 于 描述 资 


图 1-7 语义 Web 体系 架构 源 及 其 相互 关系 ; RDF Schema 层 为 RDF 提供 类 
型 定义 机 制 , 确 定 RDF 描述 的 资源 所 使 用 的 领域 
词汇 。 为 , XML 不 具备 语义 描述 能 力 , W3C 推荐 以 RDF (Resource Description 
Framework) 标 准 来 解决 XML 的 语义 局 限 。 
RDF 解决 的 是 如 何 采 用 XML 标准 语法 无 二 义 性 地 描述 资源 对 象 的 问题 ,使 得 所 描述 
的 资源 的 元 数据 信息 成 为 机 器 可 理解 的 信息 。RDF Schema 使 用 一 种 机 器 可 以 理解 的 体系 
来 定义 描述 资源 的 词汇 ,其 目的 是 提供 词汇 柑 入 的 机 制 或 框架 ,在 该 框架 下 多 种 词汇 可 以 集 
成 在 一 起 实现 对 Web 资源 的 描述 。 
(4) Ontology 十 Rules 层 。 本 体 (Ontology) 负 责 在 RDF(S) 基 础 上 定义 的 概念 及 其 关 
系 的 抽象 描述 ,用 于 描述 应 用 领域 的 知识 ,描述 各 类 资源 及 资源 之 间 的 关系 ,实现 对 词汇 表 
的 扩展 。 在 这 一 层 , 用 户 不 仅 可 以 定义 概念 而 且 可 以 定义 概念 之 间 的 复杂 关系 。 规 则 用 于 
描述 领域 知识 中 的 前 提 和 结论 。 本 体 和 规则 共同 构成 领域 知识 层 。 
W3C 推荐 使 用 OWL(Web Ontology Language) 作 为 Web 本 体 描述 语言 ,OWL 既 提供 
了 正式 的 语义 ,又 提供 了 附加 的 词汇 , 比 起 XML 、RDF 和 RDF Schema, 对 Web 内 容 实 现 了 
更 好 的 机 器 互 操作 性 。 
(5) Unify Logic 层 。 该 层 负 责 在 下 面 各 层 基础 上 ,提供 公理 和 推理 规则 ,而 Logic 一 旦 
建立 , 便 可 以 通过 逻辑 推理 对 资源 资源 之 间 的 关系 以 及 推理 结果 进行 验证 ,证 明 其 有 效 性 。 
(6) Proof 层 。 通 过 Proof 交换 以 及 数字 签名 ,建立 一 定 的 信任 关系 ,从 而 证 明 语 义 
Web 输出 的 可 靠 性 以 及 其 是 否 符合 用 户 的 要 求 。 
(7) Trust 层 。 支 持 代 理 间 通 信 的 证 据 交 换 , 在 用 户 间 建立 信任 关系 。 
(8) User Interface 十 Applications 层 。 应 用 层 是 构建 在 语义 Web 之 上 的 各 种 应 用 。 
总 之 ,在 语义 Web 体系 架构 中 .下面 两 层 是 语义 Web 的 基础 设施 ; 中 间 从 元 数据 发 展 
到 本 体 描述 语言 及 其 统一 的 逻辑 是 语义 Web 的 关键 ; 证 明和 信任 及 各 层次 贯穿 的 数字 签 
名 技术 是 扩充 ,是 对 语义 Web 成 功 应 用 的 要 求 与 展望 。 


3. 语义 Web 的 应 用 
在 语义 Web 中 ,可 以 提供 各 种 依靠 语义 的 自动 化 服务 ,包括 如 下 两 项 。@ 互 联网 信息 
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发 布 与 搜索 。 通 过 对 内 容 的 标注 与 分 析 从 而 克服 关键 词 查询 的 歧义 性 ,可 以 大 大 提高 查询 
精度 。 此 外 ,基于 语义 Web 的 文档 检索 与 知识 管理 也 是 当前 研究 的 一 个 热点 。@ Web 问 
题解 答 。 在 用 Ontology 对 信息 源 进行 标注 的 基础 上 ,进一步 运用 知识 库 来 解答 用 户 的 提 
问 。 例 如 ,Stanford 大 学 研制 的 Triple 系统 是 一 个 基于 人 逻辑 程序 设计 的 RDF 查询 系统 ,好 
辑 子 句 的 问题 求解 能 力 使 它 能 够 解答 较为 复杂 的 问题 。 德 国 Karlsruhe 大 学 等 单位 研制 的 
SEAL 是 一 个 语义 Web 门户 网 站 , 它 具 有 回答 用 F- 逻 辑 表示 的 查询 的 能 力 ,F- 迎 辑 使 得 
Ontology 中 的 概念 与 问题 求解 规则 融合 于 一 体 。 

语义 Web 的 目标 是 改善 当今 的 Web, 它 的 主要 思想 是 使 语义 信息 成 为 计算 机 可 处 理 
的 对 象 。 要 将 Web 语义 化 是 非常 困难 的 ,语义 Web 很 难 一 下 子 获得 巨大 成 功 ,但 是 , 它 会 
一 点 点 地 渗透 到 现 有 的 Web 中 ,让 人 们 不 知 不 觉 地 进入 语义 Web 的 时 代 。 
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本 章 首先 介绍 了 Internet 的 产生 和 发 展 , 然 后 介绍 了 万 维 网 的 概念 以 及 万 维 网 和 
Internet 的 关系 ; 讲解 了 Web 服务 器 、Web 浏览 器 的 概念 和 功能 并 详细 讲解 了 HTTP 的 原 
理 。 在 此 基础 上 ,介绍 了 WWW 中 的 常见 概念 , 较 详 细 地 介绍 了 Web 相关 技术 ,包括 Java 
技术 .XML 技术 和 Web 服务 。 从 应 用 的 角度 出 发 ,介绍 了 计算 机 应 用 模式 的 变迁 ; 分 别 对 
集中 式 计算 .C/S 计算 模式 和 基于 Web 的 B/S 三 层 体系 结构 进行 了 介绍 ,并 分 析 了 B/S 架 
构 Web 应 用 的 基本 工作 过 程 。 从 软件 开发 的 角度 ,介绍 了 软件 系统 体系 架构 及 开发 模式 的 
发 展 ,并 详细 讲解 了 SOA 架构 的 设计 思想 、 基 本 框架 和 应 用 模式 。 最 后 ,简要 介绍 了 语义 
Web 的 概念 和 发 展 。 


加 是 


1. 上 网 查询 以 下 HTTP 头 域 的 含义 及 取 值 : 
Host、User-Agent、Accept、Accept-Charset、Keep-Alive、Connection、Date、Expired 、 
Referer,Server ,Last-Modified Etag、 Via, 
2. 什么 是 Web 服务 器 和 Web 浏览 器 ? 简 述 它们 的 基本 功能 。 
. 什么 是 B/S 结构 ? 它 和 C/S 结构 相 比 有 什么 优点 ? 
. 画 出 B/S 三 层 架 构 概 念 图 , 简 述 其 基本 工作 机 理 。 
. 什么 是 Web 应 用 ? Web 应 用 和 传统 的 exe 程序 有 何不 同 ? 
. Java 技术 包括 哪些 方面 的 内 容 ? 
. XML 技术 标准 体系 是 如 何 划 分 的 ? 列举 常用 的 XML 基础 标准 ,并 说 明 它 们 的 


Daw 


功能 。 
8. 什么 是 Web 服务 ? Web 服务 基于 哪些 主要 的 技术 标准 ? 
9. 什么 是 语义 Web? 画 出 语义 Web 的 分 层 模型 ,并 说 明 各 层 的 功能 。 
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【本 章 导 读 】 

在 Internet 中 ,Web 服务 是 最 主要 的 网 络 服务 之 一 ,几乎 一 提 到 Internet, 就 会 想到 万 
维 网 (World Wide Web,WWW)。 实 际 上 ,WWW 只 是 Internet 的 一 个 子 集 , 它 是 由 
Internet 中 的 Web 服务 器 和 Web 客户 机 构成 的 。Web 服务 器 就 是 那些 安装 了 Web 服务 
器 软件 的 计算 机 ,而 安装 了 Web 浏览 器 的 计算 机 则 是 Web 客户 机 。Web 技术 不 仅 使 
Internet 更 加 精彩 ,同时 它 还 改变 了 计算 机 的 应 用 模式 ,推动 了 基于 Web 的 B/S 三 层 架 构 
的 产生 和 发 展 ,使 传统 的 计算 机 应 用 软件 发 展 到 基于 Web 的 应 用 ,从 各 种 各 样 的 电子 商 
务 平台 到 企业 和 政府 部 门 的 应 用 系统 ,大 都 部 署 在 Web 上 ,Web 应 用 已 经 成 为 计算 机 应 
用 的 主要 模式 。 

本 章 首先 介绍 Web 服务 器 和 操作 系统 的 关系 以 及 目前 主要 的 Web 服务 器 产品 ,然后 
以 Windows Server 中 的 IIS 为 例 , 介 绍 Web 服务 器 的 安装 、 配 置 和 管理 ; 讲解 一 个 Web 站 
点 的 主要 概念 ,包括 端口 、 主 目录 、 默 认 文 档 、 目 录 安 全 性 等 概念 ; 介绍 目前 使 用 最 多 的 
Apache 和 Tomcat 服务 器 的 功能 、 两 者 的 关系 ; 介绍 Java 运行 环境 、JDK、JVM 的 概念 以 及 
它们 的 安装 和 配置 ; 讲解 虚拟 主机 、 虚 拟 目 录 等 概念 ; 最 后 ,对 Web 服务 器 的 远程 管理 与 内 
容 维 护 进行 介绍 。 

【知识 要 点 】 

2.1 节 : Web 服务 器 的 概念 .Windows Server/IIS 组 件 、Apache HTTP Server。 

2.2 节 : Internet 信息 服务 (IIS) 组 件 IIS 组 件 的 安装 、Internet 服务 管理 器 。 

2.3 节 :新建 Web 站 点 ,主机 头 、 主 目录 、 站 点 的 启动 、 站 点 的 停止 ,Web 应 用 目录 结构 
的 规划 ,文件 命名 、URL。 

2.4 节 : Web 站 点 属性 、 站 点 的 配置 IP 地 址 及 域名 限制 .匿名 访问 和 验证 控制 .默认 文 
六 HTTP 头 。 

2.5 节 : Apache 服务 器 .Tomcat 应 用 服务 器 ,Apache 服务 器 的 安装 、Apache 服务 器 的 
基本 配置 Java 运行 环境 、Tomcat 的 安装 和 配置 .Apache 和 Tomcat 的 整合 。 

2.6 节 : 虚拟 主机 的 概念 ,基于 IP 地 址 的 虚拟 主机 、 基 于 域名 的 虚拟 主机 、Apache 中 
虚拟 主机 的 配置 、 虚 拟 目 录 的 概念 .Apache 中 虚拟 目录 的 配置 ,Tomcat 中 虚拟 目录 的 
配置 。 

2.7 节 : 远程 管理 ,终端 服务 .远程 桌面 FTP 服务 。 
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@.1 操作 系统 与 Web 服务 器 


在 全 球 数 亿 个 网 站 或 Web 应 用 系统 的 背后 ,都 运行 着 一 个 Web 服务 器 。 要 使 一 台 计 
算 机 成 为 Web 服务 器 ,需要 安装 网 络 操作 系统 和 相应 的 Web 服务 组 件 。 不 同 的 操作 系统 
平台 ,安装 的 Web 服务 组 件 也 不 相同 。Web 服务 组 件 从 本 质 上 讲 就 是 一 个 网 站 或 Web 应 
用 的 运行 环境 ,因此 ,安装 的 Web 服务 组 件 不 同 , Web 应 用 的 开发 工具 也 不 相同 。 

目前 ,主流 的 Web 服务 器 软件 主要 有 微软 的 IIS 和 开源 软件 Apache Web 服务 器 。IIS 
支持 ASP 和 .NET 编程 ,只 能 运行 在 Windows 平台 下 ,Apache 支持 PHP、CGI.JSP 编程 且 
可 运行 于 多 种 操作 系统 平台 。 虽 然 Apache 是 世界 使 用 排名 第 一 的 Web 服务 器 平台 ,但 是 ， 
由 于 Windows 的 易 用 性 ,因此 具有 很 大 的 装机 数量 ,IIS 的 应 用 也 很 多 。 


2.1.1 Web 服务 器 


在 Internet 中 ,Web 服务 器 有 两 个 层面 的 含义 ,一 是 指 安 装 了 Web 服务 器 的 计算 机 ,二 
是 指 Web 服务 器 程序 。 所 谓 Web 服务 器 程序 ,简单 地 讲 就 是 一 个 服务 程序 , 它 仅仅 需要 监 
听 合适 的 端口 ,建立 连接 ,然后 发 送 数据 。 服 务 器 程序 的 开发 总 是 和 客户 端 软件 的 开发 相 辅 
相 成 的 。 

20 世纪 90 年 代 , Web 服务 器 、 浏 览 器 .HTML 和 HTTP 都 得 到 了 快速 的 发 展 ,这 标志 
着 WWW 的 诞生 。 美 国 国家 超级 计算 应 用 中 心 (NCSA) 开 发 了 httpd 代码 ,实现 了 Web 服 
务 器 的 功能 。 同时, NCSA 开发 了 最 早 的 浏览 器 , 即 NCSA Mosaic 浏览 器 ,是 后 来 的 
Netscape、 微 软 IE 以 及 众多 网 页 浏览 器 的 鼻祖 。 虽 然 NCSA Web 服务 器 不 再 被 维护 和 继 
续 开发 ,但 是 仍然 可 以 免费 下 载 其 源 代码 , 它 是 著名 的 Web 服务 器 Apache 的 前 身 。 

随 着 Internet 的 发 展 , 人 们 对 Web 服务 器 的 功能 提出 了 更 多 的 需求 。Web 服务 成 为 很 
多 商务 应 用 都 必须 面 对 和 采用 的 技术 时 ,就 出 现 了 很 多 不 同 Web 服务 器 以 满足 这 些 不 同 的 
需求 。 在 电子 商务 应 用 环境 中 ,可 伸缩 性 、 可 靠 性 和 高 级 动态 功能 都 是 Web 服务 器 应 该 具 
有 的 关键 因素 。 此 外 ,易于 配置 和 管理 对 于 新 手 来 说 也 同样 重要 。 对 于 这 些 所 有 的 特性 来 
说 并 没有 任何 一 个 特定 服务 器 能 完全 满足 需求 ,但 是 如 果 对 Web 服务 的 需求 有 明确 的 认 
识 ,可 以 从 不 同 的 Web 服务 器 中 选择 适合 的 服务 器 。 


2.1.2 主流 Web 服务 器 简介 


Web 服务 器 产品 很 多 ,同一 种 Web 服务 器 往往 也 有 不 同 的 操作 系统 版 本 ,下 面 对 各 种 
不 同 的 Web 服务 器 进行 简要 介绍 。 


1. Internet Information Server 


Internet Information Server(IIS) 是 Windows 自 带 的 服务 器 组 件 。 在 Windows 2000 
Server 中 , 自 带 了 IIS 5.0,Windows Server 2003 中 自 带 了 IIS 6.0。 现 在 ,微软 已 经 全 部 采 
用 Windows Server 2003/IIS 6. 0, 而 不 再 安装 Windows Server 2000/IIS 5.0 了 。 

在 IIS 中 ,包含 了 一 系列 的 ASP 对 象 ,负责 ASP 页 面 中 服务 端 脚本 程序 的 解析 工作 , 同 
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时 ,为 用 户 开发 基于 Web 的 应 用 提供 一 个 开发 环境 。JIS 6. 0 支持 Web 应 用 的 .NET 开发 
环境 。 

作为 Windows 平台 的 内 置 服务 组 件 , 其 优点 是 容易 安装 和 管理 ,但 是 最 大 的 缺点 是 只 
能 安装 在 Windows 平台 中 ,不 能 在 其 他 的 操作 系统 平台 上 安装 。 

在 Windows 服务 器 上 ,除了 安装 IIS 外 ,还 可 以 安装 Apache 和 Tomcat。 其 中 ,Tomcat 
是 Serverlet/JSP 的 容器 ,可 以 运行 JSP 脚本 程序 ,开发 基于 JSP 的 Web 应 用 系统 。 


2. Apache HTTP Server 


Apache HTTP Server 是 Apache 软件 基金 会 "开发 的 一 个 Web 服务 器 产品 , 它 是 
Apache 组 织 的 开发 爱好 者 们 在 美国 伊利 诺 伊 斯 大 学 超级 计算 机 应 用 程序 国家 中 心 
(National Center for Supercomputing Applications,NCSA) 开 发 的 NCSA HTTPd 服务 器 
的 基础 上 开发 与 维护 的 一 个 HTTP 服务 器 ,简称 为 Apache 服务 器 。 

在 发 展 初 期 ,Apache 主要 是 一 个 基于 UNIX 系统 的 服务 器 , 它 的 宗旨 就 是 建成 一 个 基 
于 UNIX 系统 的 、 功 能 更 强 、 效 率 更 高 并 且 速 度 更 快 的 WWW 服务 器 。 目 前 ,Apache 是 使 用 最 
广 的 Web 服务 器 ,有 多 个 操作 系统 平台 版 本 ,可 以 运行 在 几乎 所 有 的 UNIX、Windows、Linux 
等 主流 操作 系统 平台 上 ,并 且 很 多 类 型 的 UNIX 操作 系统 都 集成 了 Apache。 

因为 Apache 服务 器 具有 简单 高效、 性 能 稳定 、 安 全 .免费 等 特性 ,已 经 成 为 最 为 广泛 
的 Web 服务 器 。 许 多 大 型 的 网 站 ,例如 Google、Yahoo、 阿 里 巴巴 、 新 浪 、 百 度 、 网 易 、 搜 狐 等 
都 采用 Linux 或 FreeBSD 等 操作 系统 平台 ,并 配置 Apache 服务 器 ,构建 自己 的 Web 服务 
器 。 在 版 本 上 ,大 多 数 公司 应 用 Apache 2.0 或 Apache 2. 2. x。 


3. 其 他 Web 服务 器 


除了 Apache 和 IIS 外 ,还 有 以 下 一 些 不 同 特点 的 Web 服务 器 。 

(1) Zeus Webserver 服务 器 。Zeus 是 一 个 商业 化 的 Web 服务 器 产品 ,在 SMP 环境 下 
有 优秀 的 可 伸缩 性 ,并 实现 了 常见 的 特性 集合 ,如 访问 控制 动态 内 容 产生 和 安全 等 。 具 有 
健壮 、 集 成 有 集群 支持 的 容错 和 负载 平衡 等 特色 ,是 高 端 应 用 的 很 好 的 选择 。 

(2) iPlanet 服务 器 。iPlanet 是 Sun、Netscape 和 AOL 公司 联合 生产 的 Web 服务 器 产 
品 ,iPlanet 和 其 他 Netscape 产品 一 样 具有 很 高 的 性 能 ,而 且 iPlanet 具有 Sun 公司 Java 的 
特性 。iPlanet 具有 现今 高 性 能 Web 服务 器 的 特性 ,相对 于 其 他 Web 服务 器 ,iPlanet 能 够 
提供 更 多 的 Java 功能 ,能 够 运行 标准 Java API, 并 且 在 Java API 环境 下 运行 速度 良好 。 

(3) AOLserver Web 服务 器 。AOLserver 的 研究 始 于 1994 年 ,当时 它 作 为 Web 发 布 
系统 的 一 部 分 进行 开发 。 在 该 Web 发 布 系统 中 内 嵌 了 Web 服务 器 的 WYSIWYG(CWhat 
You See Is What You Get, 所 见 即 所 得 ) 网 页 编辑 器 ,该 网 页 编辑 器 强调 内 容 变化 的 便利 性 
和 内 容 更 新 的 快捷 性 。 早 期 的 Web 发 布 系统 被 设计 成 一 个 完整 的 网 页 编辑 系统 。 随 着 时 
间 的 推移 ,AOL 公司 的 网 页 编辑 器 已 经 不 复 存在 ,但 是 由 于 TCL 脚本 语言 的 出 现 和 它 对 动 


四 Apache 软件 基金 会 (Apache Software Foundation, ASF) ,是 专门 为 支持 开源 软件 项 目 而 办 的 一 个 非 盈 利 性 组 
织 , 正 式 创建 于 1999 年 , 它 的 创建 者 是 一 个 自称 为 “Apache 组 织 ”( 北 美 当地 一 支 印 第 安 部 落 的 名 称 ) 的 群体 。ASF 支持 
了 大 量 的 Apache 项 目 和 子 项 目 ,例如 Apache HTTP Server、Tomcat、Struts 等 。 
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态 网 页 的 支持 ,AOLserver 却 生存 了 下 来 。 

Web 服务 器 产品 很 多 , 随 着 互联 网 技术 的 发 展 ,新 的 Web 服务 器 产品 还 将 不 断 出 现 。 
选择 Web 服务 器 时 ,服务 器 对 动态 脚本 语言 .API 的 支持 以 及 数据 库 连 接 的 性 能 都 是 重要 
的 因素 。 此 外 ,Web 服务 器 的 配置 和 管理 ,也 是 选择 Web 服务 器 的 重要 因素 。 


@.2 使 用 Internet 信息 服务 


在 Windows 操作 系统 平台 上 ,内置 了 Internet 信息 服务 (Internet Information Server, IIS) 
组 件 , 用 于 创建 Web 服务 器 。 作 为 Windows 平台 ,最 常用 的 是 Windows 2000 Server 和 
Windows Server 2003 ,其 中 Windows 2000 Server 内 置 了 IIS 5.0, Windows Server 2003 内 置 了 
JIS 6.0。 目 前 ,Windows Server 2003/TIS 6.0 是 Windows 平台 最 主要 的 Web 服务 器 配置 。 


2.2.1 什么 是 Internet 信息 服务 


IIS 是 一 组 Windows 操作 系统 组 件 ,此 组 件 可 以 使 公司 很 方便 地 创建 自己 的 Web 服务 
器 .FTP 服务 器 、E-mail 服务 器 和 NNTP 服务 器 ,从 而 将 信息 和 业务 应 用 程序 发 布 到 Web 
中 。 在 IIS 内部, 本质 上 是 由 一 系列 的 ASP 对 象 组 成 的 ,负责 ASP 页 面 中 服务 端 脚本 程序 
的 解析 工作 ,同时 ,为 用 户 开发 基于 Web 的 应 用 提供 一 个 开发 环境 。 

在 Windows 2000 中 ,内 置 了 TIS 5.0。 从 Windows Server 2003 开始 ,IIS 升级 为 IIS 6.0, 将 
IIS 5. 0 中 的 SMTP 服务 器 升级 为 完整 的 E-mail 服务 器 。IIS 由 若干 可 选 组 件 构成 ,用 户 可 
以 根据 需要 选择 不 同 的 组 件 进行 安装 和 配置 ,IIS 包含 如 下 组 件 。 

(1) Internet 服务 管理 器 。 用 于 配置 和 管理 IIS, 可 以 在 MMC 中 以 管理 单元 形式 显示 ， 
该 管理 工具 还 在 控制 面板 的 “管理 工具 "文件 夹 中 创建 一 个 快捷 方式 。 

(2) Internet 服务 管理 器 (HTML)。 基 于 HTML 的 Internet 服务 管理 器 ,可 以 使 用 浏 
览 器 对 IIS 进行 远程 管理 。 

(3) NNTP Service。NNTP(Network News Transfer Protocol, 网 络 新 闻 传 输 协议 )， 
是 TCP/IP 套件 的 成 员 。 负 责 将 新 闻 函 件 分 发 到 Internet 上 的 NNTP 服务 器 和 NNTP 客 
户 端 ,设置 NNTP 后 ,就 可 以 将 新 闻 文章 存储 在 服务 器 上 的 中 央 数 据 库 , 用 户 可 以 选择 指定 
的 项 目 阅 读 。 

(4) SMTP Service。SMTP(Simple Mail Transfer Protocol, 简单 邮件 传输 协议 ), 是 
TCP/IP 套件 的 成 员 , 用 来 管理 邮件 代理 之 间 的 电子 邮件 交换 。 

(5) World Wide Web 服务 。Web 服务 ,用 于 对 Web 站 点 的 创建 ,管理 以 及 为 用 户 访问 
Web 服务 器 提供 服务 ,内 置 服务 端 脚本 引擎 ,是 ASP 等 服务 器 脚本 规范 的 容器 。 

(6) 文档 传输 协议 (FTP) 服 务 器 。 用 于 建立 FTP 站 点 ,支持 文件 的 上 传 和 下 载 。 配 置 
FTP 服务 器 ,可 以 有 效 地 对 WWW 服务 器 站 点 内 容 实行 远程 维护 。 


2.2.2 安装 1IS 


安装 Windows 2000 Server 时 ,默认 情况 下 .IIS 5. 0 被 一 并 安装 。 在 Windows Server 
2003 中 ,IIS 组 件 是 “应 用 服务 器 ”的 一 部 分 ,可 以 在 安装 操作 系统 时 选择 安装 ,也 可 以 通过 
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“添加 /删除 Windows 组 件 "方式 来 安装 IIS ,或 者 通过 管理 工具 中 的 “管理 您 的 服务 器 ?程序 
添加 “应 用 程序 服务 器 ”角色 ,来 完成 IIS 6.0 的 安装 。 

下 面 以 Windows Server 2003 企业 版 为 例 ,说 明 IIS 的 安装 。 具 体操 作 步 又 如 下 。 

(1) 将 Windows Server 2003 系统 光盘 插入 光盘 驱动 器 。 

(2) 在 “控制 面板 ”窗口 中 ,双击 “添加 /删除 程序 ”图 标 ; 在 “添加 /删除 程序 ”窗口 中 , 单 
击 “ 添 加 /删除 Windows 组 件 ” 按 钮 ,打开 “Windows 组 件 向 导 ” 对 话 框 ; 在 组 件 列 表 中 ,选择 
“应 用 程序 服务 器 ”( 在 Windows 2000 Server 中 为 Internet 信息 服务 ) ,然后 单 击 “ 详 细 信 
息 ” 按 钮 ,打开 “应 用 程序 服务 器 ”对 话 框 ,如 图 2-1 所 示 。 


2-1 “应 用 程序 服务 器 ”对 话 框 


(3) 在 应 用 程序 服务 器 组 件 列表 中 ,选择 “Internet 信息 服务 ”, 然 后 单 击 “ 详 细 信 息 ” 按 
钮 ,打开 “Internet 信息 服务 (IIS)” 对 话 框 ,显示 Windows Server 2003 中 相关 组 件 , 如 图 2-2 
所 示 。 


Internet 信息 服务 (TIS) 


| 回 seaSMTP Service 
会 公用 文件 
口 拿 后 台 智 能 传送 服务 (BITS) 服务 器 扩展 


2-2 Internet 信息 服务 组 件 列表 
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(4) 选中 “万 维 网 服务 " 复 选 框 ,然后 单 击 “ 详 细 信 息 ” 按 钮 ,打开 “万 维 网 服务 "对话 框 ， 
显示 万 维 网 服务 子 组 件 列表 ,如 图 2-3 所 示 。 


2-3 “万 维 网 服务 ”对 话 框 


(5) 在 万 维 网 服务 子 组 件 列表 中 ,选择 相应 的 组 件 ,包括 “万 维 网 服务 ”"“ 远 程 管理 
(HTML)” 和 “远程 桌面 Web 连接 ”, 然 后 单 击 “ 确 定 ” 按 钮 ,向 导 从 光盘 复制 文件 并 进行 相 
关 的 配置 。 安 装 结束 后 ,在 “控制 面板 ”的 “管理 工具 ”中 将 增加 “Internet 信息 服务 (IIS) 管 理 
器 ”“ 远 程 桌面 "等 程序 。 同 时 ,在 服务 器 C 盘 根 目录 下 将 创建 一 个 Inetpub 文件 夹 ,在 该 文 
件 夹 下 创建 多 个 子 文件 夹 ,文件 夹 结构 如 图 2-4 所 示 。 


篇 C:\Inetpub 


@ 1 文人 天 必 i 到 
I 
成 共享 此 文件 严 


图 2-4 安装 IIS 6.0 后 自动 创建 的 相关 文件 夹 


各 文件 夹 说 明 如 下 。 
J@ AdminScripts 文件 夹 : 存储 CGI 脚本 的 根 目 录 。 
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@ ftproot 文件 夹 : ftp 服务 根 目录 。 

@ mailroot 文件 夹 : SMTP 服务 器 根 目录 。 

@ nntpfile 文件 夹 : 新 闻 组 信息 根 目录 。 

回 wwwroot 文件 夹 : 默认 Web 站 点 的 根 目录 。 


2.2.3 Internet 信息 服务 管理 器 概述 


IIS 安装 完成 后 ,在 Web 服务 器 的 “管理 工具 ”文件 夹 中 增加 “Internet 服务 管理 器 ” 工 
有 具 。 同 时 在 “计算 机 管理 ”控制 台中 ,在 “服务 和 应 用 程序 ”节点 下 增加 “Internet 信息 服务 ” 
节点 。 通 过 Internet 服务 管理 器 ,可 以 创建 Web 站 点 .FTP 站 点 ,以 及 对 它们 进行 配置 和 管 
理 。 对 IIS 的 管理 可 以 有 多 种 途径 ,主要 如 下 。 


1. Internet 信息 服务 管理 器 


单 击 “ 开 始 ” 按 钮 ,指向 “程序 ”“ 管 理工 具 ”, 执 行 *Internet 信息 服务 (IIS) 管 理 器 ”命令 
可 以 直接 启动 Internet 信息 服务 管理 器 ,如 图 2-5 所 示 。 


转 Internet 信息 服务 (IIS) 管 理 器 
呈 文件 中 操作) 查看 WW 窗口 思 帮助 中 
ETIeCJIeeLE TEL 
Internet 信息 服务 
日 虽 sl (本 地 计算 机 ) 盒 默 认 网 站 
日 入 FIP 站 点 全 Adninistration 6100 
钱 默 认 FTP 站 点 
六 应 用 程序 池 


日 贸 
默认 网 站 


Administration 


图 2-5 “Internet 信息 服务 (IIS) 管 理 器 ”控制 台 


在 安装 IIS 的 Web 服务 器 时 ,系统 创建 了 两 个 Web 站 点 ,一 个 是 “默认 站 点 ”, 端 口号 为 
80, 男 一 个 为 Administration, 端口 号 为 8098。 其 中 ,默认 网 站 主要 用 于 初学 者 学 习 ， 
Administration 站 点 则 可 以 对 Web 服务 器 实施 远程 维护 , 即 登录 该 站 点 即 可 。 


2. Internet 信息 服务 管理 单元 
安装 IIS 后 ,Internet 服务 管理 器 作为 一 个 管理 单元 ,被 组 织 到 “计算 机 管理 (本 地 )” 控 


制 台 中 。 在 “控制 面板 ”>“ 管 理工 具 ” 中 ,双击 “计算 机 管理 ”, 打 开 “ 计 算 机 管理 ”控制 台 , 忆 
以 显示 “Internet 信息 服务 (IIS) 管 理 器 ?节点 ,如 图 2-6 所 示 。 
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所 计算 机 管理 
ET 
所 学 | 外因 | 办 国 区 | 国 | 昱 | 上 相册 


外- 汐 默认 SMTP 虚拟 服务 器 
由 二 默认 NTP 虚拟 服务 器 


图 2-6 计算 机 管理 控制 台中 的 “Internet 信息 服务 (JIS) 管 理 器 ”管理 单元 


@.3 Web 站 点 


在 Windows 平台 中 , 当 安 装 了 IIS 后 ,就 可 以 创建 Web 站 点 了 ,从 而 把 该 计算 机 配置 
为 Internet 中 的 一 台 Web 服务 器 ,向 用 户 提供 Web 连接 服务 。 


2.3.1 创建 Web 站 点 


在 Windows 服务 器 /TIS 中 ,可 以 利用 IIS 创建 和 管理 Web 站 点 。 下 面 以 Windows 
Server 2003 企业 版 为 例 , 介 绍 IIS 中 Web 站 点 的 创建 过 程 。 

(1) 单 击 “ 开 始 ” 一 “程序 ”一 “管理 工具 ”一 “Internet 服务 (IIS) 管 理 器 ,打开 “Internet 
信息 服务 ”控制 台 , 右 击 * 网 站 ”节点 ,打开 快捷 菜单 ,如 图 2-7 所 示 。 


旧 Internet 信息 服务 (IIS) 管 理 器 


午 文 件 外 ”操作 W 查看 WW 窗口 如 于 助 人 0 
守 池 | 因 | 四 | 略 加 区 | 岛 |[ 屋 | 》 | 
Internet 信息 服务 


依 球 认同 站 1 正在 运行 
全 Atninistration 6100 正在 运行 


图 2-7 ”打开 快捷 菜单 
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(2) 选择 “新 建 ”>“ 网 站 ”命令 ,打开 “网 站 创建 向 导 ”; 单 击 “ 下 一 步 ”按钮 ,打开 “网 站 
描述 ”界面 ,如 图 2-8 所 示 。 


2-8 输入 网 站 描述 


(3) 在 “网 站 描述 ”界面 ,输入 Web 站 点 的 说 明 ( 即 新 站 点 的 名 称 ), 该 名 称 将 在 
“Internet 信号 服务 (IIS) 管 理 器 "控制 台中 显示 。 单 击 * 下 一 步 "按钮 ,打开 如 图 2-9 所 示 的 


网 站 创建 向 导 


2-9 “IP 地 址 和 端口 设置 ?对 话 框 


(4) 在 “网 站 IP 地 址 ”下 拉 列 表 框 中 ,默认 显示 “(全 部 未 分 配 )”。 单 击 下 拉 列 表 框 ,可 
以 显示 网 卡 设置 的 多 个 IP 地 址 。 可 以 选择 “(全 部 未 分 配 )” 或 从 中 选择 一 个 IP 地 址 。 

(5) 根据 开放 系统 互联 模型 (OSI 模型 ), 所 有 的 计算 机 通信 程序 都 应 有 一 个 特定 的 端 
口号 , 它 是 通信 程序 的 标识 ,用 于 发 送 和 接收 特定 的 数据 包 。 因 此 ,在 服务 器 上 ,每 一 个 服务 
程序 也 需要 设置 一 个 唯一 的 端口 号 。 对 于 Web 服务 器 ,使 用 HTTP 通信 ,默认 的 端口 号 为 
80, 如 果 运 行 多 个 Web 站 点 ,可 以 修改 该 端口 号 。 此 时 ,采用 默认 端口 80 ,该 设置 可 以 在 以 
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后 的 网 站 管理 中 很 容易 地 修改 。 指 定 80 以 外 的 端口 号 ,要 连接 到 该 站 点 ,在 网 址 (IP 地 址 
或 域名 ) 后 ,需要 给 定 对 应 的 端口 号 ,如 http://202. 194. 73. 118: 8001/ 。 

(6) 主机 头 即 域名 的 概念 , 它 也 是 在 一 台 Web 服务 器 上 运行 多 个 Web 站 点 的 方式 之 
一 。 要 运行 多 个 Web 站 点 ,除了 设置 不 同 的 端口 号 外 ,还 可 以 注册 多 个 域名 ,为 每 个 站 点 设 
置 不 同 的 主机 头 , 即 域名 。 这 里 全 部 选用 默认 值 , 单 击 “下 一 步 ”, 打 开 如 图 2-10 所 示 的 对 
话 框 。 


目录 
主 目录 是 Web 内 容 子 目录 的 根 目录 。 


ET 


vy 


图 2-10 “网 站 主 目录 ”对 话 框 


(7) 从 组 成 上 来 讲 , 所 谓 一 个 “网 站 ”, 是 由 一 个 文件 夹 及 其 包含 的 子 文件 夹 和 大 量 的 网 
页 文件 .图片 等 资源 文件 构成 的 ,这 个 文件 夹 称 为 站 点 的 主 目录 。 要 设置 网 站 主 目录 , 单 击 
“路 径 "文本 框 右 侧 的 “浏览 "按钮 ,选择 一 个 目录 作为 网 站 主 目录 即 可 。 主 目录 保存 了 一 个 
Web 站 点 中 的 所 有 内 容 , 包 括 各 个 子 文件 夹 以 及 所 有 的 网 页 文件 。 站 点 主 目录 又 称 为 站 点 
的 根 目录 ,站 点 首页 文件 通常 存储 在 站 点 的 主 目录 下 。 

(8) 单 击 * 下 一 步 "按钮 ,打开 * 网 站 访问 权限 ”界面 ,如 图 2-11 所 示 。 


局 用 | 


到 
本 
到 


2-11 “网 站 访问 权限 ”界面 
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(9) 根据 需要 ,对 Web 站 点 的 权限 进行 设置 ,从 允许 的 权限 中 选择 相应 的 权限 。 一 般 
ean 运行 脚本 (如 ASP)” 权 限 。 有 关 权 限 设置 的 详细 介绍 参 
见 2.4 节 。 
(10) 单 击 * 下 一 步 ?按钮 ,打开 * 已 经 成 功 完成 Web 站 点 创建 向 导 ” 界 面 。 单 击 “ 完 成 ” 
按钮 ,返回 到 “Internet 信息 服务 (11S) 管理 器 ”控制 台 ,如 图 2-12 所 示 。 


间 Internet 信息 服务 (ITIS) 管 理 器 


由 Administration 
六 Yeb 服务 扩展 
田 -总 y 默认 SNMTP 虚拟 服务 器 
起 默认 NTP 虚拟 服务 器 


图 2-12 “Internet 信息 服务 (IIS) 管 理 器 ”控制 台 


从 控制 台中 可 以 看 出 ,新 建 的 站 点 被 标记 为 停止", 这 是 因为 它 和 “默认 站 点 ”端口 号 冲 
突 造 成 的 ( 均 为 80)。 要 想 启 动 该 站 点 ,可 以 修改 站 点 的 端口 号 ,或 者 修改 其 他 站 点 属性 , 比 
如 主机 头 、IP 地 址 。 如 果 新 站 点 主 目录 中 没有 任何 内 容 , 则 右 侧 的 窗 格 显示 为 空 。 


2.3.2 Web 站 点 的 启动 ,停止 和 暂停 


从 上 面 可 看 到 由 于 新 建站 点 和 默认 Web 站 点 IP 地 址 和 端口 号 完全 一 样 ,使 得 新 建站 
点 被 停止 。 如 果 要 将 停止 的 Web 站 点 启动 , 右 击 被 停止 的 Web 站 点 ,在 快捷 菜单 中 ,选择 
“启动 ”命令 ,该 站 点 将 被 启动 。 如 果 要 停止 一 个 Web 站 点 , 右 击 该 站 点 ,在 快捷 菜单 中 , 选 
择 “ 停 止 ”命令 ,该 站 点 将 被 停止 。 

当 管 理 人 员 需 要 维护 系统 或 网 页 数据 时 ,可 以 暂停 Web 站 点 ,站 点 暂停 后 , 它 将 不 接受 
客户 浏览 器 的 连接 ,等 用 户 工作 结束 后 ,再 启动 该 站 点 。 

如 果 用 户 试图 连接 一 个 暂停 的 站 点 ,客户 端 浏 览 器 显示 “ 找 不 到 该 页 ”消息 (HTTP 
404- 示 找到 文件 )。 如 果 试 图 连接 一 个 停止 的 站 点 ,客户 端 浏览 器 显示 “该 页 无 法 显示 ”的 消 
息 ( 找 不 到 服务 器 或 DNS 错误 ) 。 


2.3.3 规划 Web 应 用 


一 个 Web 站 点 建立 后 ,就 意味 着 一 个 Web 应 用 的 开始 。 所 谓 Web 应 用 ,是 指 在 

Internet 环境 中 ,应 用 程序 新 的 开发 和 使 用 模式 , 它 是 B/S 结构 下 ,应 用 程序 的 实现 形式 。 

一 个 Web 网 站 可 以 简单 地 看 做 一 个 Web 应 用 , 它 由 主 目录 、 子 目录 及 其 包含 的 网 页 文件 、 
图 片 文件 及 其 他 各 类 文件 ,以 及 相关 的 数据 库 构 成 。 
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1. 规划 网 站 的 文件 结构 


一 个 网 站 , 即 一 个 Web 应 用 ,应 该 根据 用 户 需求 来 设计 网 站 的 功能 ,或 栏目 。 为 了 管理 
方便 ,应 该 根据 网 站 功能 对 网 站 文件 夹 结构 进行 认真 规划 。 一 般 情况 下 ,在 主 目录 下 往往 需 
要 创建 多 个 子 文件 夹 , 每 个 文件 夹 对 应 网 站 的 一 个 功能 ,存储 相关 的 网 页 文件 。 对 于 一 些 公 
用 的 程序 或 图 片 ,可 以 定义 单独 的 文件 夹 。 此 外 ,还 可 以 规划 数据 库 文件 夹 ,存储 网 站 用 到 
的 数据 库 文件 ,便于 整个 网 站 的 备份 。 

对 于 新 建 的 网 站 ,假设 该 网 站 设计 有 四 个 主要 功能 栏目 : 即时 消息 、 在 线 聊 天 .BBS 和 
个 人 博客 ,在 主 目录 下 可 以 分 别 创建 四 个 文件 夹 ,分 别 存储 开发 即时 消息 、 在 线 聊天 .BBS 
和 个 人 博客 所 用 到 的 网 页 文件 ,文件 结构 可 以 如 图 2-13 所 示 。 


Er 六 作 的 Er WD 者 助 0 大 可 
生 守 | 四 图 | 久 多 轩 图 | 贸 | 显 | Pn 


Baatabase 
加 images 
Dnybbs 

A 加 wyinstantmessage 


Adninistration 


田 馈 images 
nybbs 

加 名 wyinstantmessage 
加 in 

Yeb 


图 2-13 站 点 主 目录 下 的 内 容 组 织 


2. 文件 夹 和 文件 的 命名 


在 开发 实践 中 ,为 了 管理 的 方便 ,在 命名 文件 和 文件 夹 时 ,需要 遵循 下 面 几 条 一 般 性 的 
命名 原则 。 

(1) 使 用 名 称 前 缀 。 因 为 文件 和 文件 夹 的 列表 通常 按照 字母 排序 ,因此 ,可 以 将 功能 相 
近 的 文件 夹 或 文件 ,使 用 相同 的 名 称 前 级 ,从 而 保证 列表 时 能 够 挨 在 一 起 。 

(2) 使 用 名 称 后 缀 或 序号 。 许 多 功能 可 以 分 成 几 个 步骤 ,每 一 个 步骤 可 能 是 一 个 网 页 
文件 ,为 了 管理 方便 ,在 命名 这 些 网 页 文件 时 ,可 以 在 名 称 后 面部 分 添加 序号 或 后 级 ,这 样 可 
以 保证 在 列表 中 这 些 文件 是 顺序 相连 的 。 

例如 ,注册 一 个 用 户 , 可 能 分 成 两 个 步骤 ,对 应 的 网 页 文件 名 可 以 为 newuser( 注 册 信 息 
输入 页 面 ) ,newusersave( 数 据 库 操作 ) 。 也 可 以 命名 为 newuserl .newuser2 等 。 

(3) 大 小 写 问 题 。 有 的 Web 服务 器 (例如 Tomcat) 区 分 文件 夹 和 文件 名 大 小 写 , 命 名 
时 要 注意 。 

(4) 避免 中 文 命名 。 因 为 有 些 Web 服务 器 对 中 文 命名 支持 不 好 ,在 命名 文件 夹 和 文件 
名 时 ,尽量 避免 中 文 名 。 
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3. 网 站 首页 


传统 的 应 用 程序 都 有 一 个 主 用 户 界面 ,包含 菜单 栏 .工具 栏 等 ,用 户 通过 菜单 命令 或 工 
有 具 按钮 执行 特定 的 程序 功能 。 在 B/S 结构 中 ,一 个 Web 应 用 则 是 从 网 站 首页 开始 的 ,相当 
于 传统 的 应 用 程序 主 用 户 界面 。 

首页 (Home Page) 是 当 客户 连接 到 一 个 站 点 时 首先 看 到 的 Web 页 面 。 在 设计 Web 站 
点 的 首页 时 ,不 仅 要 考虑 页 面 的 外 观 、 栏 目 布局 ,更 重要 的 是 在 页 面 内 容 上 必须 包含 可 以 到 
各 种 功能 页 面 的 超 链 接 。 首 页 的 默认 文件 名 一 般 为 index. htm、default. htm 等 ,首页 文件 
通常 需要 保存 在 Web 站 点 的 主 目录 下 。 


2.3.4 访问 Web 站 点 


Web 站 点 是 由 主 目录 及 其 包含 的 一 系列 文件 夹 和 网 页 文件 构成 的 ,每 个 站 点 都 有 一 个 
首页 文件 。 用 户 访问 网 站 即 是 通过 Web 浏览 器 并 从 站 点 中 下 载 网 页 文件 的 过 程 , 要 连接 到 
一 个 Web 站 点 ,应 该 在 浏览 器 地 址 栏 中 输入 要 下 载 的 页 面 的 URL ,一般 形式 为 : 

http:// 网 址 [ :端口 号 ][/[ 路 径 / 文 件 名 ]][? 参 数 名 = 参数 值 & 参数 名 = 参数 值 …] 

其 中 : 

(1) 网 址 可 以 是 域名 ,也 可 以 为 IP 地 址 。 端 口号 对 应 Web 服务 器 上 设 定 的 Web 站 点 
TCP 端口 ,默认 值 为 80 。 如 果 端 口号 为 80, 则 在 URL 中 可 以 省 略 不 写 。 

(2) 路 径 , 是 指 相 对 于 Web 站 点 主 目录 的 相对 路 径 , 如 果 不 指定 路 径 , 则 代表 站 点 主 目 
录 , 站 点 根 即 紧 接 在 网 址 (端口 ) 后 面 的 “/”, 后 面 是 根 下 面 的 子 目 录 。 

(3) 文件 名 。 访 问 一 个 Web 站 点 , 即 从 Web 站 点 中 指定 的 路 径 中 下 载 文 件 , 并 传输 到 
客户 端 浏 览 器 进行 显示 的 过 程 。 因 此 ,在 URL 中 需要 指定 要 下 载 文件 的 路 径 和 文件 名 。 
如 果 未 指定 文件 名 , 则 代表 要 下 载 网 站 首页 文件 ,首页 文件 在 Web 站 点 属性 中 设置 ,并 存储 
在 Web 站 点 根 目录 中 。 

(4) 参数 表 。 在 访问 一 个 网 页 文件 时 ,特别 是 带 有 脚本 的 网 页 ,有 时 需要 将 一 些 参数 传 
给 网 页 中 的 脚本 程序 ,这 些 要 传递 的 参数 在 文件 名 后 面 的 ?后面 列 出 , 即 一 系列 的 参数 名 / 
参数 值 对 。 

如 果 是 在 IIS 服务 器 计算 机 上 ,也 可 以 输入 http://127. 0. 0. 1 或 http://localhost 来 
访问 本 机 上 的 Web 站 点 。 其 中 ,localhost 为 本 机 (127. 0. 0. 1) 的 域名 。 可 以 用 记事 本 打开 
hosts 文件 (文本 文件 ,无 扩展 名 ,存储 在 \WINNTANsystem32\driversNetc 文件 夹 中 ) ,看 到 
127.0.0. 1 的 域名 为 localhost, 因 此 hosts 又 称 为 本 地 域名 解析 。 


@.4 Web 站 点 的 配置 


在 Windows Server/IIS 中 , 当 Web 站 点 建立 后 ,还 需要 对 Web 站 点 进行 管理 ,管理 
Web 站 点 是 通过 “Web 站 点 属性 ”对 话 框 来 完成 的 。 在 “Internet 信息 服务 (1IS) 管 理 器 " 控 
制 台 目 录 树 中 , 右 击 站 点 ,选择 “属性 ”命令 ,打开 站 点 属性 对 话 框 ,通过 站 点 属性 对 话 框 ,可 
完成 一 个 站 点 的 配置 和 管理 。 
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2.4.1 设置 Web 站 点 端口 号 


在 Web 站 点 属性 对 话 框 中 ,“ 网 站 ”选项 卡 列 出 了 网 站 的 一 般 属性 ,显示 了 站 点 当前 的 
属性 设置 ,如 图 2-14 所 示 。 


| 


PP 


图 2-14 Web 站 点 属性 对 话 框 


在 “网 站 ?选项 卡 中 ,包括 三 个 选项 组 的 设置 。 

(1)“ 网 站 标识 ”选项 组 。 该 选项 组 包含 以 下 内 容 。 

a 描述 : 站 点 的 说 明 性 文字 ,该 文字 出 现在 “Internet 信息 服务 (IIS) 管 理 器 ”控制 台 目 
录 树 的 节点 中 ,用 于 标识 一 个 站 点 。 

@ IP 地 址 : 设置 站 点 要 使 用 的 IP 地 址 ,如 果 计 算 机 中 设置 了 多 个 IP 地 址 ,可 以 选择 
其 中 一 个 。 如 果 该 服务 器 上 同时 运行 多 个 Web 站 点 , 单 击 “ 高 级 "按钮 ,可 进行 进一步 的 
设置 。 

@ TCP 端口 : 站 点 使 用 的 端口 号 为 80,HTTP 的 默认 端口 为 80 。 如 果 设 置 其 他 端口 
例如 将 端口 号 设置 为 8001, 则 客户 要 访问 该 网 站 时 ,需要 在 浏览 器 地 址 栏 中 的 网 址 后 指定 
端口 号 ,例如 http:// 网 址 :8001/ ,以 指定 特定 端口 的 Web 站 点 。 

(2)“ 连 接 ” 选 项 组 。 该 选项 组 包含 以 下 内 容 。 

O@ 连接 超时 : 如 果 客 户 端 建立 了 连接 ,在 连接 超过 规定 的 时 间 没 有 访问 操作 ,系统 将 
该 连接 强制 断 开 。 

@ 保持 HTTP 连接 : 在 HTML 中 ,在 一 个 网 页 中 如 果 包 含 图 片 动画 等 媒体 素材 , 它 
们 并 不 是 嵌入 网 页 中 ,而 是 和 网 页 一 样 是 以 独立 的 文件 存在 的 。 如 果 选 中 * 保 持 HTTP 连 
接 ” 复 选 框 , 则 当 用 户 下 载 一 个 网 页 时 ,Web 服务 器 会 将 其 中 的 图 片 等 文件 一 同 发 送 给 客 
户 端 。 

如 果 取 消 选 中 “保持 HTTP 连接 ” 复 选 框 , 当 网 页 中 包含 多 个 文件 连接 时 ,客户 端 每 下 
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载 一 个 文件 就 要 与 Web 服务 器 建立 一 个 连接 ,这 将 降低 Web 服务 器 的 执行 性 能 。 

(3)“ 启 用 日 志 记 录 ” 选 项 组 。 选 中 “启用 日 志 记录 ” 复 选 框 将 启用 Web 站 点 的 日 志 记 
录 功 能 ,该 功能 可 记录 用 户 活动 的 细节 并 以 选择 的 格式 创建 日 志 。 启 用 日 志 记 录 后 ,需要 在 
“活动 日 志 格 式 ” 下 拉 列 表 框 中 选择 格式 。 


2.4.2 设置 Web 站 点 主 目录 


主 目录 是 一 个 网 站 的 根 ,网 站 的 所 有 文件 都 保存 于 主 目录 及 其 所 包含 的 子 文件 夹 中 ,或 
者 通过 虚拟 目录 使 用 主 目录 外 的 物理 文件 来。 根据 客户 访问 Web 站 点 的 验证 过 程 , 当 用 户 
通过 身份 验证 后 , 接 下 来 ,Web 站 点 会 根据 站 点 的 权限 设置 ,来 决定 可 以 提供 给 用 户 的 服 
务 , 例 如 从 网 站 浏览 网 页 (下 载 文件 )、 上 传 文件 等 。 

在 网 站 属性 对 话 框 中 ,选择 “ 主 目录 ”选项 卡 ,如 图 2-15 所 示 。 
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图 2-15 “ 主 目录 ”选项 卡 


下 面 介绍 “ 主 目录 ”选项 卡 中 的 部 分 选项 。 

(1) 访问 权限 设置 。 该 部 分 包含 以 下 内 容 。 

中 读 取 : 默认 状态 下 Web 站 点 拥有 读 取 权 限 , 即 站 点 提供 客户 读 取 服务 器 上 文件 的 权 
限 , 即 客户 可 以 从 站 点 中 下 载 文 件 。 

@ 写 入 : 允许 用 户 上 传 文件 ,或 提交 表单 改变 网 页 内 容 。 

@ 目录 浏览 : 允许 用 户 浏览 站 点 目录 , 当 客 户 通过 浏览 器 连接 到 本 站 点 时 ,如 果 未 指 
定 路 径 和 文件 名 ,默认 状态 下 ,Web 服务 器 将 站 点 的 默认 文档 (首页 ) 发 送 给 客户 。 此 时 ,如 
果 默 认 文档 不 存在 ,如 果 选 中 “目录 浏览 ” 复 选 框 , Web 服务 器 将 站 点 的 站 点 目录 列表 到 客 
户 端 浏览 器 (不 显示 虚拟 目录 ) ,如 图 2-16 所 示 。 

(2) 应 用 程序 设置 。 应 用 程序 设置 可 以 指定 何 种 应 用 程序 可 以 在 Web 站 点 执行 。 在 
“执行 权限 ”下 拉 列 表 框 中 ,包括 “无 "…“ 纯 脚本 ”和 “脚本 和 可 执行 程序 ”。 如 果 选 择 “ 无 ”, 则 
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不 允许 在 Web 站 点 中 运行 程序 (包括 服务 器 端 ASP 脚本 ), 当 浏览 一 个 ASP 页 时 ,会 显示 
“网 页 无 法 显示 ”, 在 页 面 中 提示 :“ 您 试图 从 目录 中 执行 CGI、ISAPI 或 其 他 可 执行 程序 ,但 
该 目录 不 允许 执行 程序 ”。 选 择 “ 纯 脚本 ”, 则 只 能 执行 ASP 程序 等 。 选 择 * 脚 本 和 可 执行 程 
序 ”, 则 所 有 的 应 用 程序 (包括 exe 文件 和 dll 库 ) 都 可 以 在 Web 站 点 上 执行 。 


到 127.0.0.1 - / - Wicrosoft Internet Erplorer 
文件 四 ” 编 各 四 ”查看 WW 收 豪 中 工具 中 ”帮助 中 | 
回 恨 -日 -四 四 加 | 部 抽 雪 说 收 天 地 振作 如 | 全 "名 加 "- 中 训 


天 直 加 j 鸭 http://127.0.0. 1/ 


127.0.0.1 -/ 


2007 年 6 月 30 日 <dir> database 
2007 年 8 月 30 日 <dir> images 

2007 年 6 月 30 日 0 index.asp 
2007 年 68 月 30 日 <dir> mybbs 

2007 年 8 月 30 日 <dir> myinstantmessage 
2007 年 8 月 30 日 <dir> myonline 


图 2-16 网 站 目录 浏览 界面 


2.4.3 Web 站 点 目录 安全 性 配置 


Web 站 点 的 安全 性 设置 主要 通过 “目录 安全 性 ”选项 卡 完成 。 当 用 户 通过 Web 浏览 器 
发 出 访问 某 个 页 面 的 请 求 并 且 Web 服务 器 收 到 客户 的 请 求 后 ,可 以 利用 HTTP 请 求 包 获 
取 客 户 端的 信息 ,同时 启动 一 个 验证 过 程 ( 例 如 检查 用 户 端 的 IP 地 址 是 否 受 限 等 ) 来 决定 是 
否 将 网 页 传 给 客户 端 。 

通过 验证 过 程 的 验证 后 ,Web 服务 器 会 根据 网 页 的 类 型 执行 不 同 的 操作 。 如 果 网 页 是 
html 类 型 的 , 则 Web 服务 器 将 把 该 网 页 直接 传送 到 客户 端 浏览 器 ; 如 果 网 页 为 服务 器 页 
(如 asp jsp 等 ), Web 服务 器 将 先 在 服务 器 端 执行 该 网 页 文件 ,然后 将 执行 结果 传 给 客户 端 
浏览 器 。 

要 进行 Web 站 点 的 安全 性 设置 ,在 站 点 属性 对 话 框 中 ,选择 “目录 安全 性 ?选项 卡 , 如 
图 2-17 所 示 。 

下 面 介 绍 “ 目 录 安 全 性 ”选项 卡 中 的 相关 选项 。 

(1)“IP 地 址 和 域名 限制 ”选项 组 。 在 该 选项 组 中 , 单 击 “ 编 辑 ” 按 钮 ,打开 “IP 地 址 和 域 
名 限制 ”对 话 框 ,如 图 2-18 所 示 。 

在 “IP 地 址 和 域名 限制 ”对 话 框 中 ,选择 “授权 访问 " 单 选 按 钮 , 单 击 “ 添 加 ”按钮 ,可 以 指 
定 不 能 访问 该 站 点 的 卫 地 址 。 类 似 地 ,选择 “拒绝 访问 " 单 选 按钮 , 单 击 “ 添 加 ”按钮 ,可 以 指 
定 在 拒绝 访问 中 ,能够 访问 该 站 点 的 IP 地 址 清单 。 

当 用 户 来 自 拒绝 访问 的 IP 地 址 时 ,客户 浏览 器 端 会 收 到 “您 没有 权限 查看 网 页 ”的 提示 
信息 。 一 般 情 况 下 ,如 果 网 站 是 公开 的 ,选择 “授权 访问 ” 单 选 按钮 , 单 击 “ 添 加 ”按钮 ,把 不 被 
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欢迎 的 IP 地 址 列 出 。 相 反 , 如 果 网 站 是 一 个 特殊 的 站 点 ,只 允许 部 分 人 访问 , 则 选择 “拒绝 
访问 ? 单 选 按钮 , 单 击 “ 添 加 ?按钮 ,把 可 以 访问 的 了 P 列 出 。 


I? 地 址 和 域名 限制 


图 2-18 “IP 地 址 和 域名 限制 ?对 话 框 


(2)“ 身 份 验证 和 访问 控制 ?选项 组 。 当 Web 站 点 验证 了 客户 端的 IP 地 址 后 , 接 下 来 
查看 该 站 点 是 否 允 许 匿 名 访问 。 如 果 站 点 不 允许 匿名 访问 ,或 者 客户 端 要 访问 的 文件 有 特 
殊 的 NTFS 限制 ,此 时 客户 端 需要 输入 用 户 账户 和 密码 。 

当 Web 站 点 允许 匿名 访问 时 ,客户 端 不 需要 输入 账户 和 密码 就 可 以 访问 网 站 的 数据 ， 
此 时 Web 站 点 会 尝试 用 Internet Guest Account 账号 “IUSER_ 计 算 机 名 称 ” 这 个 内 部 账户 
让 计算 机 登录 。 要 设置 匿名 访问 ,在 “身份 验证 和 访问 控制 ”选项 组 中 , 单 击 “ 编 辑 ” 按 钮 , 打 
开 “ 身 份 验证 方法 ”对 话 框 ,如 图 2-19 所 示 。 

选中 “启用 匿名 访问 " 复 选 框 。 单 击 “ 浏 览 ” 按 钮 ,打开 “匿名 用 户 账号 ”对 话 框 可 以 指定 
用 于 匿名 访问 的 匿名 用 户 帐号。 匿名 访问 使 得 每 个 人 都 可 以 使 用 上 述 账 号 访问 Web 网 站 。 
如 果 匿 名 账户 没有 足够 的 NTFS 权限 ,系统 会 根据 在 “验证 访问 ”选项 组 中 选择 的 验证 方 
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式 , 要 求 用 户 输 入 账号 和 密码 ,如 果 未 选择 任何 验证 方法 , 则 系统 不 提示 用 户 输入 账户 和 密 
码 ,而 是 直接 拒绝 用 户 对 该 页 的 访问 。 

一 般 情况 下 ,如 果 Web 站 点 连接 到 Internet, 选 中 “启用 匿名 访问 ” 复 选 框 , 即 允 许 匿名 
访问 。 如 果 Web 站 点 设置 了 匿名 访问 , 当 客 户 访问 该 站 点 时 ,仍然 出 现 “ 输 入 网 络 密码 ”对 
话 框 ,这 是 由 于 匿名 账户 不 拥有 要 访问 的 NTFS 权限 造成 的 。 

为 了 避免 遗漏 对 Web 主 站 点 的 NTFS 权限 设置 ,导致 客户 端 不 能 正常 地 访问 所 需要 的 
Web 页 ,在 “Internet 信息 服务 (IIS) 管 理 器 ”控制 台中 ,提供 了 ”权限 向 导 ?” 命 令 。 碳 击 站 点 ， 
在 快捷 菜单 中 ,选择 “所 有 任务 ”>“ 权 限 向 导 ” 命 令 , 启 动 *IIS 权限 向 导 ”。 按 照 向 导 提示 操 
作 , 一 般 取 默认 值 ,最 后 单 击 “ 完 成 "按钮 。 再 来 访问 该 站 点 ,看 能 否 成 功 。 


身份 验证 方法 


2-19 “身份 验证 方法 ”对 话 框 


2.4.4 设置 Web 站 点 默认 文档 


下 面 介绍 如 何 设置 站 点 的 默认 文档 , 即 相当 于 站 点 的 首页 。 默 认 文 档 可 以 是 htm 文 
件 , 也 可 以 是 asp jsp 等 包含 服务 端 脚本 的 文件 。 当 用 户 通 过 浏览 器 连接 到 Web 站 点 时 ,如 
果 没 有 指定 要 浏览 的 文档 ,Web 站 点 将 默认 文档 传送 给 用 户 浏 览 器 。 

在 Web 站 点 属性 对 话 框 中 ,选择 “文档 ”选项 卡 , 如 图 2-20 所 示 。 

选中 “启用 默认 内 容 文档 ” 复 选 框 ,也 可 以 单 击 “ 添 加 ”按钮 ,增加 一 个 新 的 默认 文档 ,如 
index. htm、startpage. htm 等 。 如 果 有 多 个 默认 文档 ,系统 将 把 排 在 前 面 的 文档 优先 传送 给 
客户 浏览 器 。 通 过 列表 下 面 的 “上 移 ”“ 下 移 ” 按 钮 ,可 以 改变 相应 顺序 。 

如 果 选 中 “启用 文档 页 脚 " 复 选 框 , 则 服务 器 在 传送 要 求 的 网 页 之 前 ,会 在 文档 的 底部 插 
入 页 角 文 字 , 然 后 再 传送 。 

文档 页 脚 对 应 一 个 htm 文件 ,这 个 htm 文件 不 应 该 是 一 个 包含 二 html 二 过 /html 二 、 
去 body 二 二 /body 二 等 标记 的 完整 的 htm 文件 ,只 能 包含 文字 的 大 小 和 颜色 设置 ,例如 : 
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<h3 align = right >E- learning 站 点 </h3> 


文件 可 以 用 Windows 操作 系统 中 的 “记事 本 ”程序 编辑 ,并 保存 为 . htm 类 型 的 文件 。 


图 2-20 “文档 ”选项 卡 


2.4.5 设置 Web 站 点 HTTP 头 


第 1 章 已 经 介绍 了 HTTP 及 HTTP 通信 的 过 程 ,HTTP 头 (HTTP Header) 是 对 现 有 
http 标准 的 扩充 ,有 许多 复杂 的 应 用 ,实现 客户 端 和 服务 端的 信息 交换 。 在 “HTTP 头 ” 选 
项 卡 中 ,可 以 对 站 点 做 四 种 设置 ,如 图 2-21 所 示 。 


2-21 “HTTP 头 ”选项 卡 
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选中 “启用 内 容 过 期 " 复 选 框 ,可 以 设置 此 站 点 页 面 的 内 容 有 效 期 。Web 服务 器 将 页 面 
发 送 到 客户 端 时 ,同时 也 发 送 了 网 页 的 有 效 期 。 

选择 “立即 过 期 " 单 选 按钮 , 则 网 页 内 容 一 下 载 到 浏览 器 端 该 页 面 就 过 期 了 。 因 此 ,浏览 
器 每 次 连接 到 该 网 站 时 ,无 论 客户 端的 本 地 网 页 缓存 是 否 存在 对 应 的 页 面 ,页 面 都 会 被 重新 
下 载 。 它 适合 于 一 些 显示 即时 行情 ,如 股市 行情 的 网 站 。 

选择 “此 时 间 段 后 过 期 " 单 选 按钮 后 ,设置 网 页 的 有 效 期 , 当 浏 览 器 连接 到 该 站 点 浏览 网 
页 时 ,网 页 被 保存 在 客户 端的 缓存 文件 夹 中 ,时 间 到 后 ,该 网 页 将 自动 地 从 客户 端 缓存 中 删 
除 ,适合 于 一 些 固定 时 间 更 新 的 新 闻 站 点 和 页 面 。 

“过 期 时 间 " 单 选 按钮 和 “此 时 间 段 后 过 期 "类 似 , 用 于 设置 网 页 的 有 效 期 。 

在 网 页 浏览 中 ,缓存 技术 和 有 效 期 设置 可 以 提高 整个 互联 网 的 性 能 。 当 用 户 浏览 某 个 
网 页 时 , 它 首先 要 检查 本 地 的 缓存 是 否 保存 了 要 浏览 的 页 面 , 如 果 已 经 保存 该 页 面 ,还 要 检 
查 页 面 是 否 过 期 ,如 果 没 有 过 有 效 期 , 则 浏览 器 将 直接 从 本 地 缓存 打开 该 网 页 ,而 不 链接 
Web 服务 器 下 载 页 面 。 如 果 页 面 在 缓存 中 不 存在 ,或 者 存在 但 已 经 过 了 有 效 期 , Web 浏览 
器 将 连接 Web 服务 器 ,进行 页 面 下载 。 对 于 许多 网 页 (例如 一 些 文件 ) ,其 内 容 并 不 更 新 , 因 
此 缓存 技术 可 以 提高 浏览 速度 ,减少 互联 网 流量 。 


@.5 使 用 Apache 和 Tomcat 


在 Web 服务 器 产品 中 , Apache/Tomcat 是 Apache 软件 基金 会 开发 的 跨 平台 的 Web 
服务 器 /应 用 服务 器 组 合 , 和 微软 的 Windows Server/IIS 相 比 ,Apache/Tomcat 具有 多 种 操 
作 系 统 版 本 ,可 以 安装 在 Windows、Linux、UNIX 等 不 同 的 操作 系统 平台 中 。 此 外 ,由 于 
Web 服务 器 还 决定 了 Web 程序 的 类 型 ,IIS 及 内 置 的 ASP 引擎 支持 asp 和 .NET 开发 ,如 
果 需 要 开发 基于 Java 技术 的 网 站 ,也 需要 选择 Apache/Tomcat 服务 器 。 基 于 上 述 原 因 , 在 
商业 应 用 领域 ,Apache/Tomcat 比 Windows Server/IIS 的 应 用 更 加 广泛 。 


2.5.1 Apache 与 Tomcat 


Apache 是 Apache 软件 基金 会 开发 的 HTTP Server, 简 称 Apache 服务 器 ,有 多 个 操作 
系统 平台 版 本 ,是 使 用 最 广 的 Web 服务 器 之 一 , 它 可 以 运行 在 几乎 所 有 广泛 使 用 的 计算 机 
系统 平台 上 ,以 高 效 稳定、 安全、 免费 而 著称 。Apache 服务 器 具有 以 下 特性 。 

(1) 支持 HTTP/1. 1 通信 协议 。 

(2) 支持 基于 IP 和 基于 域名 的 虚拟 主机 。 

(3) 支持 多 种 方式 的 HTTP 认证 。 

(4) 提供 用 户 会 话 过 程 的 跟踪 。 

(5) 支持 通用 网 关 接 口 (CGDI) 。 

(6) 集成 Perl 处 理 模块 。 

(7) 集成 代理 服务 器 模块 。 

(8) 支持 实时 监视 服务 器 状态 和 定制 服务 器 日 志 。 

(9) 支持 服务 器 端 包含 指令 (SSD 。 
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(10) 支持 安全 Socket 层 (SSL) 。 

(11) 支持 FastCGI。 

(12) 通过 第 三 方 模块 可 以 支持 Java Servlet。 

(13) 拥有 简单 而 强 有 力 的 基于 文件 的 配置 过 程 。 

Tomcat 是 Apache 软件 基金 会 Jakarta 项 目 中 的 一 个 核心 项 目 , 由 Apache、Sun 和 其 他 
一 些 公司 及 个 人 共同 开发 而 成 ,是 针对 Apache 服务 器 开发 的 JSP 应 用 服务 器 ,是 Java 
Servlet 和 Java Server Pages(JSP) 技 术 的 标准 实现 ,由 于 有 Sun 的 参与 和 支持 ,最 新 的 
Servlet 和 JSP 规范 总 是 能 在 Tomcat 中 得 到 体现 ,因为 Tomcat 技术 先进 ,性 能 稳定 ,是 目 
前 流行 的 Web 应 用 服务 器 。Tomcat 是 基于 Apache 许可 证 下 开发 的 自由 软件 。 可 以 从 
Apache 的 官方 网 站 http://jakarta. apache. org/tomcat/index. html 下 载 不 同 的 Apache 
Tomcat 版 本 。 

可 以 这 样 认 为 , 当 在 一 台 机 器 上 配置 好 Apache 服务 器 ,可 利用 它 响 应 对 HTML 页 面 
的 访问 请 求 。 当 用 户 要 浏览 的 页 面 是 JSP 服务 器 页 面 时 ,Apache 调用 Tomcat, 由 Tomcat 
执行 JSP 中 的 服务 端 脚本 程序 ,将 执行 结果 返 给 Apache, 然 后 Apache 再 将 结果 页 面 发 送 到 
客户 端 浏览 器 。 实 际 上 Tomcat 部 分 是 Apache 服务 器 的 扩展 ,但 它 是 独立 运行 的 ,所 以 当 
运行 Tomcat 时 , 它 实际 上 作为 一 个 与 Apache 独立 的 进程 单独 运行 。 


2.5.2 ”Apache 的 安装 与 基本 配置 


Apache 服务 器 为 开源 软件 ,可 以 从 Apache 官方 网 站 (http://www. apache. org/) 下 
载 。 在 Apache 官方 网 站 首页 中 ,有 一 个 Apache Projects 列表 ,显示 Apache 项 目 超 链接 列 
表 , 单 击 HTTP Server 超 链接 ,将 打开 Http Server 项 目 页 面 (http://httpd. apache. org/) 。 


1. 下 载 Apache 服务 器 


在 Http Server 项 目 页 面 (http://httpd. apache. org/) ,选择 要 下 载 的 Apache 版 本 。 
需要 说 明 的 是 ,版 本 不 一 定 是 最 新 的 ,但 一 定 要 选择 一 个 稳定 的 版 本 ,目前 使 用 较 广 的 版 本 
是 Apache HTTP Server 2.2.8。 然 后 ,根据 操作 系统 不 同 选择 不 同 的 Apache 服务 器 。 

对 于 Windows 平台 ,有 两 个 可 选 的 版 本 ,分别 是 Win32 Binary without crypto (no mod 
_ssl) 和 Win32 Binary including OpenSSL 0. 9. 8g。OpenSSL 为 开放 安全 套 接 层 (Secure 
Socket Layer,SSL) 协 议 ,可 以 在 Internet 上 提供 秘密 性 传输 ,包含 密码 算法 库 、SSL 协议 库 
以 及 应 用 程序 ,目前 的 版 本 为 0.9. 8g。 选 择 Win32 Binary including OpenSSL 0.9. 8g 下 载 ,将 
服务 器 文件 apache_2. 2. 8-win32-x86-openssl-0. 9. 8g. msi 下 载 到 本 地 计算 机 (4.8MB) 。 

目前 ,Apache for win32 使 用 msi 的 形式 发 布 ,.msi 文件 类 型 是 一 种 可 以 安装 的 程序 包 
文件 ,双击 带 .msi 扩展 名 的 文件 时 ,操作 系统 将 .msi 文件 与 Windows 安装 程序 关联 并 运行 
客户 端 安装 程序 服务 Msiexec. exe, 从 而 使 Windows 环境 下 安装 Apache 变 得 非常 简单 。 


2. Apache 的 安装 


当 Apache 服务 器 下 载 后 ,可 以 按照 下 列 步骤 完成 Apache Web 服务 器 的 安装 和 配置 。 
(1) 双击 Apache 的 安装 文件 apache_2. 2. 8-win32-x86-openssl-0. 9. 8g. msi, 执行 安装 
向 导 , 如 图 2-22 所 示 。 
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‘Welcome to the Installation Wizard for 
Apache HTTP Server 2.2.8 


The Installation Wizard wil install Apache HTTP Server 2.2.8 on 
Your computer, To continue, cick Next. 


WARNING: This program is protected by copyright law and 
international treaties， 


图 2-22 Apache 服务 器 的 安装 


(2) 单 击 Next 按钮 ,打开 Server Information 界面 ,如 图 2-23 所 示 。 


妆 apache HITP Server 2.2 - Installation Wizard 
Server Information 


Please enter your server's information ， 


Network Domain (e,g, somenet.com) 
Eau.edu.m 

Server Name (e.g. ww.somenet, com): 
hao.sdu.edu.cnl 


Administrator's Email Address (e.g. webmaster@somenet.com): 
jpwesduedum 


Install Apache HTTP Server 2.2 programs and shortcuts for: 


© for Al Users, on Port 0, as a Service -~ Recommended, 
Oonly for the Current User, on Port 8080, when started Manually. 


图 2-23 Apache 安装 向 导 输 入 信息 界面 


(3) 在 Apache 的 安装 过 程 中 ,需要 输入 网 站 域名 ( 即 网 站 所 在 的 DNS 域 的 名 字 )、 服 务 
器 的 域名 ( 即 服务 器 主机 名 十 域名 )\ 网 站 管理 员 的 E-mail, 按 照 网 站 的 实际 情况 填写 。 如 果 
是 个 人 用 户 ,可 能 没有 上 述 数据 ,可 按 格式 填 一 下 临时 的 名 字 。 然 后 , 单 击 Next 按钮 ,选择 
安装 类 型 (Typical 或 Custom) 。 

(4) 单 击 Typical 按钮 ,按照 向 导 提 示 操 作 , 选 择 安装 路 径 ,直至 安装 完成 。 安 装 结束 
后 ,指定 安装 目录 的 文件 夹 结构 如 图 2-24 所 示 。 

(5) Apache 服务 安装 成 功 后 ,在 Windows“ 开 始 ” 菜 单 中 增加 Apache HTTP Server 2. 2 程 
序 组 。 同 时 ,在 “控制 面板 ”“ 管 理工 具 ” 文 件 夹 下 ,双击 “服务 "图标, 显示 Apache 已 经 启 
动 , 以 后 Apache 将 作为 一 项 服务 , 随 着 机 器 的 启动 而 自动 运行 。 
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地 址 四 ) | 局 c: \Apache2.2\conf 


已 四 wace22 国 


| 国 
司 回 wine 4， 
司 国 "ie。 tme= 


国 opensal 


El | 


图 2-24 Apache 安装 目录 文件 夹 结构 


(6) 不 需要 重新 开机 ,Apache 会 自动 启动 ,在 Windows 任务 栏 的 右 侧 显示 Running all 
Apache Services 图 标 较 .此 时 运行 浏览 器 程序 ,在 地 址 栏 中 输入 http://localhost/ 或 
http://127. 0.0. 1/ ,看 到 默认 的 Apache 首页 ,显示 It works。 

需要 说 明 的 是 ,如 果 计算 机 上 已 经 安装 了 IIS ,输入 http://localhost/ 后 将 首先 显示 IIS 
的 默认 站 点 。 此 时 ,可 以 按照 2. 3.2 节 的 介绍 停止 IS 中 的 Web 服务 器 ,或 者 给 IIS 中 的 
Web 服务 指定 一 个 不 同 的 端口 号 (不 同 于 默认 的 80 端口 )。 然 后 再 输入 http://localhost/ 
即 可 显示 Apache 服务 器 设置 的 页 面 。 此 时 还 可 以 通过 http://localhost: 端口 号 /继续 打 
开 IIS 中 的 默认 Web 站 点 。 


3. Apache 的 配置 


Apache 的 主 配 置 文件 为 纯 文 本 格式 的 httpd. conf, 它 的 存储 位 置 为 \Apache\Conf\。 
随 着 Apache 版 本 的 发 展 ,趋向 于 使 用 单一 的 配置 文件 httpd. conf 来 存放 所 有 的 配置 指令 ， 
如 客户 访问 信息 .记录 认证 信息 和 虚拟 服务 器 信息 等 。 

Apache 配置 选项 采用 的 是 指令 模式 ,配置 指令 设 定 各 种 参数 的 值 , 例 如 DocumentRoot 
设置 服务 器 Web 页 面 的 根 目录 。 也 可 以 灵活 地 设置 多 个 基于 IP 或 基于 域名 的 虚拟 Web 
服务 器 , 这些 Web 虚拟 服务 器 可 以 各 自 定义 独立 的 DocumentRoot 配置 指令 。 而 
LoadModule 指令 则 用 来 指定 加 载 不 同 的 模块 来 实现 对 Apache 服务 器 功能 的 扩充 。 这 些 
新 功能 大 多 是 提供 服务 器 端 对 脚本 技术 的 支持 ,比如 Perl、PHP 等 。Apache 结合 使 用 
ApacheJServ 可 以 实现 对 Java Servlet 及 JSP 的 支持 。 

用 记事 本 打开 它 , 可 以 看 到 这 些 配置 文件 都 以 文本 方式 存在 ,其 中 “# ”为 Apache 的 注 
释 符 号 ,可 以 在 “记事 本 ”程序 中 选择 “编辑 ”一 “查找 ”命令 ,在 弹出 的 对 话 框 中 逐一 输入 下 面 
要 配置 的 关键 字 , 并 进行 相应 配置 。 此 外 ,打开 Windows 的 “开始 "菜单 ,执行 “程序 ”一 
Apache HTTP Server 2. 2 一 Configer Apache Server > Edit the Apache httpd. conf 
Configuration File 命令 ,将 打开 记事 本 ,显示 httpd. conf 文本 文件 ,进行 Apache 的 配置 。 

(1) 配置 DocumentRoot 及 目录 访问 权限 。 指 定 网 站 路 径 , 即 主页 放置 的 目录 。 默 认 
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路 径 一 般 是 Apache 安装 目录 下 的 一 个 子 目录 ,例如 : 
DocumentRoot "C:/Program Files/Apache Software Foundation/Apache2.2/htdocs" 


根据 需要 ,设置 站 点 的 主 目录 ,例如 可 以 在 此 处 将 其 设 定 为 "D:/GSL3.0", 打 开 主 页 
时 ,默认 打开 的 文档 就 直接 去 该 目录 下 查找 了 。 

设置 用 户主 目录 后 ,重启 Apache, 在 浏览 器 中 输入 http://127. 0. 0. 1/ 访 问 Apache 站 
点 ,此 时 返回 一 个 403 的 错误 : 


Forbidden 
You don't have permission to access / on this server 


上 述 错误 信息 是 因为 目录 访问 权限 设置 造成 的 。 此 时 ,打开 Apache 的 配置 文件 
httpd. conf, 逐 行 检查 主 配置 文件 httpd. conf。 代 码 如 下 : 


<Directory /> 
Options FollowSymLinks 
AllowOverride None 
Order deny,allow 
Deny from all 
</Directory> 
修改 Deny from all 为 Allow from all。 
(2) 配置 DirectoryIndex。 即 设置 站 点 默认 显示 的 主页 ,一般 情况 下 ,在 此 处 还 可 以 加 
人 “Index. htm Index. php Index. jsp” 等 。 注 意 ,每 种 类 型 之 间 都 要 留 一 空格 。 
上 面 两 步 设置 完成 后 ,启动 浏览 器 ,输入 IP 即 可 访问 自己 的 Web 站 点 。 还 可 以 在 该 文 
件 的 ServerName 处 定义 域名 ,在 ServerAdmin 处 输入 E-mail 地 址 。 以 上 两 条 就 是 在 安装 
时 选择 配置 的 ,以 后 可 以 在 此 处 修改 它们 的 属性 。 
此 外 ,如 果 要 拒绝 一 部 分 人 访问 该 WWW 站 点 ,可 以 到 Apache 的 安装 目录 下 找到 
Access 文件 ,输入 要 禁止 的 IP 地 址 即 可 。 


2.5.3 Tomcat 服务 与 Servlet/JSP 规范 


Tomcat 是 当前 使 用 最 为 广泛 的 Servlet/JSP 服务 器 , 它 是 JavaSoft 和 Apache 开发 团 
队 合 作 计划 (Apache Jakarta Project) 的 产品 。 通 常情 况 下 ,Tomcat 作为 Apache 服务 器 的 
扩展 , 它 是 一 个 应 用 服务 器 ,用 于 运行 JSP 页 面 中 的 Java 程序 ,是 servlet 和 jsp 的 容器 。 

在 第 1 章 的 Java 技术 中 ,已 经 介绍 了 Java 技术 的 构成 , 即 Java 技术 包括 三 个 部 分 : 
Java 程序 设计 语言 JDK 和 Java 虚拟 机 。 因 此 ,要 保证 Tomcat 运行 Java 代码 ,在 Tomcat 
运行 环境 ,必须 得 到 Java 的 支持 ,这 就 是 说 Tomcat 的 运行 需要 Java 运行 环境 的 支持 。 

在 Tomcat 中 ,内 置 了 一 个 简单 的 HTTP Server, 因 此 单独 安装 Tomcat 也 能 够 保证 一 
个 Web 站 点 的 运行 。 从 开发 的 角度 没 必 要 用 Apache 和 Tomcat 配合 ,Tomcat 自己 完全 可 
以 应 付 。 也 就 是 说 ,不 需要 安装 Apache 服务 器 ,单独 使 用 Tomcat 即 可 运行 Web 应 用 。 但 
是 ,Tomcat 仅仅 对 JSP 程序 体现 出 比较 好 的 执行 效率 和 性 能 ,对 于 静态 页 面 的 处 理 速度 远 
不 如 Apache。 为 了 提高 Web 系统 的 整体 性 能 ,需要 将 Apache 和 Tomcat 进行 整合 配置 。 

可 以 从 Apache 网 站 http://tomcat. apache. org/ 下 载 所 需要 的 Apache Tomcat 版 本 ， 
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本 章 选 择 最 新 的 apache-tomcat-6. 0. 14. exe( 集 成 实现 了 Servlet2. 5 和 JSP2. 1 标准 ) ,讲解 
其 具体 的 安装 和 配置 。 


2.5.4 安装 Java 运行 环境 


Tomcat 需要 Java VM(JRE) (Java Runtime Environment,Java 运行 环境 ) , 即 Java 虚 
拟 机 的 支持 ,因此 ,在 安装 Tomcat 以 前 需要 安装 JRE。JRE 可 以 单独 安装 ,也 可 以 随 Java 
开发 包 JDK 一 起 安装 。 安 装 JRE 后 ,在 安装 Tomcat 时 会 自动 监测 到 。 

Java 技术 中 的 Java 运行 环境 包括 两 个 主要 的 部 分 : Java 开发 工具 包 和 Java 运行 环境 。 
它们 是 基于 Java 技术 开发 和 运行 的 基础 环境 。 在 Windows 平台 上 ,Java 环境 安装 完成 后 
需要 手工 进行 相应 的 环境 变量 配置 ,才能 正确 地 工作 。 


1. 什么 是 JDK 和 JRE 


在 安装 Java 环境 以 前 ,需要 介绍 几 个 概念 。 

在 Java 技术 中 ,大 家 经 常 看 到 JDK、J2SDK 和 JRE 等 概念 ,有 时 候 会 产生 迷惑 ,三 者 是 
一 种 什么 关系 呢 ? 

JDK 是 Sun 公司 早期 的 Java 软件 开发 工具 包 (Java Develop Kit,JDK), 包 含 所 有 编 
写 .运行 Java 程序 所 需要 的 工具 : Java 基本 组 件 、 库 .Java 编译 器 ,Java 解释 器 .小 应 用 程序 
浏览 器 ,以 及 一 些 用 于 开发 Java 应 用 程序 的 程序 等 。 从 JDK 1.2 起 ,Sun 在 命名 时 开始 使 
用 Java2, 这 就 是 J2SDK 了 ,又 分 为 企业 版 (Enterprise Edition)J2EE ,标准 版 (Standard 
Edition)J2SE 以 及 面向 嵌入 式 和 移动 计算 等 领域 的 J2ME(Micro Edition) 三 个 不 同 的 版 
本 ,详细 说 明 参 见 1. 4. 1 节 。 

JRE, 顾 名 思 义 是 Java 程序 运行 所 需要 的 环境 。 所 谓 跨 平 台 就 是 各 种 平台 都 有 一 个 中 
间 代 理 , 这 就 是 JRE。 一 般 采 用 Java 技术 开发 的 软件 都 需要 安装 JRE, 所 以 Sun 公司 就 单 
独 提供 了 JRE 安装 文件 ,以 供 Java 应 用 程序 发 布 时 所 用 。 

以 上 Java 软件 都 可 以 从 Sun 公司 的 Java 网 站 2(http://java. sun. com) 上 获取 ,网 站 上 
分 别提 供 了 J2EE SDK、J2SE SDK 以 及 Java VM(JRE) 各 种 版 本 的 下 载 。 


2. 安装 JDK 和 JRE 


http://java. sun. com/ 提 供 了 J2SDK 和 JRE 的 集成 安装 和 单独 安装 文件 ,用 户 可 以 免 
费 下 载 。 目 前 较 新 ,同时 比较 稳定 的 版 本 是 JDK6。 根 据 开发 和 应 用 的 不 同 ,可 以 选择 企业 
版 或 标准 版 。 下 面 以 J2SE6 为 例 ,介绍 JDK 和 JRE 的 安装 过 程 。 

(1) 登录 Sun 官方 网 站 http://java. sun. com/ ,在 常用 现在 区 域 (Popular Downloads), 单 
击 Java SE 超 链 ,显示 Java JDK 和 JRE 下 载 界面 ; 选择 JDK6 Update 3, 下 载 文件 为 jdk- 
6u3-windows-i586-p. exe, 包 含 JDK6 和 JRE。 

(2) 接 下 来 进行 JDK6 和 JRE 的 安装 过 程 。 双 击 jdk-6u3-windows-i586-p. exe 文件 , 运 
行 JDK6 安装 向 导 , 显 示 许 可 协议 ,打开 自 定义 安装 界面 ,如 图 2-25 所 示 。 


@ Sun 公司 被 Oracle 公司 收购 后 , 原 有 Sun 公司 的 域名 保留 ,但 会 被 自动 地 映像 到 Oracle 公司 的 站 点 。 
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图 2-25 Java2 SDK 标准 版 安装 向 导 界面 


(3) 按照 向 导 提 示 将 Java 开发 环境 安装 到 计算 机 中 ,默认 的 文件 夹 为 C:\Program 
Files\java\jdk1. 6.0 .03。 为 了 下 一 步 环 境 变量 设置 的 方便 ,通常 需要 修改 默认 安装 目录 ， 
例如 直接 安装 在 C:\Java 目录 下 , 即 C:\Java\jdk1. 6.0_03\, 这 样 便于 环境 变量 的 设置 。 

(4) 由 于 jdkl1. 6.0_03 已 经 包含 JRE, 如 果 机 器 尚未 安装 JRE, 则 在 安装 jdk1. 6 时 ， 
JRE 将 一 并 安装 。 安 装 过 程 也 需要 指定 安装 路 径 。 和 安装 JDK 同样 的 原因 ,可 以 设置 JRE 
的 安装 目录 为 C:\JavaNjrel.6.0_03\。 

(5) 当 JDK 和 JRE 安装 完成 后 ,安装 程序 在 C 盘 中 建立 相应 的 文件 夹 结构 ,存储 相应 
的 Java 运行 环境 ,文件 夹 结构 如 图 2-26 所 示 。 


“|Bjial.6.003 
BY Docwments and Settines MM | Birel 6 00s 
日 马 
BB jikl.6.0.03 


日 加 jrel.6.0.03 
田 岛 vin 


图 2-26 安装 JDK 和 JRE 文 件 夹 结构 
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(6) 按照 向 导 提 示 安 装 完成 后 ,在 “控制 面板 ”中 显示 一 个 咖啡 杯 图 标 种 
将 打开 “Java 控制 面板 ”。 
可 以 通过 “控制 面板 ”中 的 “添加 /删除 程序 ”删除 已 经 安装 的 jdk/jre。 


双击 该 图 标 ， 


3. Java 环境 变量 设置 


在 Windows 中 ,JDK 安装 完成 后 ,开发 和 运行 Java 程序 ,还 需要 进行 相应 的 环境 变量 
设置 ,以 保证 Java 程序 对 JDK 中 类 库 的 引用 。 需 要 进行 的 环境 变量 设置 包括 设置 JAVA_ 
HOME 和 CLASSPATH 环境 变量 .更 新 PATH 路 径 设 置 三 个 部 分 。 

为 了 检查 JDK 安装 程序 是 否 已 经 正确 地 设置 了 环境 变量 ,可 以 使 用 set 一 环境 变量 二 
来 检查 ,具体 办 法 是 : 

在 DOS 提示 符 下 ,通过 set 所 环境 变量 二 命令 显示 环境 变量 的 配置 情况 。JDK6 安装 
完成 后 ,环境 变量 设置 检查 结果 显示 如 图 2-27 所 示 。 


Windows [版 本 
有 1985-2883 Micr 


\Adninistrator>set JAUA_HOME 


IC: \Docunents and Se 
Path=C: \WINDOWS\s 


IC:\Docunents and Settings\Adninistrator), 


图 2-27 检查 系统 环境 变量 设置 


如 果 安 装 程序 没有 设置 Java 运行 环境 需要 的 环境 变量 ,应 该 进行 手工 设置 。 根 据 上 述 
的 JDK 安装 路 径 ( 图 2-26) ,设置 内 容 如 下 : 

set JAVA_HOME = C:\Java\jdk1.6.0_03 

set CLASSPATH = . ;SJAVA_HOME%\1lib(“.” 代 表 当 前 路 径 ) 

PATH= % PATHS% ; % JAVA HOME % \bin; %JAVA HOMES%\jre\bin 

各 环境 变量 功能 如 下 。 

(1) JAVA-HOME 表示 Java 的 安装 目录 ,在 其 他 环境 变量 中 使 用 。 

(2) CLASSPATH 定义 Javac 搜索 类 的 路 径 , 它 记录 Java 编译 器 和 解释 器 所 需要 的 类 
所 在 的 路 径 。 即 使 是 用 户 自己 创建 的 类 ,也 应 该 添加 到 CLASSPATH 中 ,这 样 比较 麻烦 ， 
所 以 在 CLASSPATH 中 添加 了 一 个 当前 目录 ( 即 “.”)。 这 样 , 当 转 到 用 户 所 在 的 目录 的 时 
候 , 由 于 Javac 编译 生成 的 用 户 类 保存 在 当前 路 径 , 必 须 把 当前 路 径 加 到 CLASSPATH 中 ， 
这 样 Java 解释 器 才能 够 找到 用 户 的 类 。 有 时 候 , 会 看 到 CLASSPATH 中 包含 一 个 . jar 等 
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压缩 的 class 文件 了 ,把 它 加 入 到 CLASSPATH 中 ,Java 环境 可 以 读 取 该 文件 。 

(3) PATH 变量 是 系统 搜索 可 执行 程序 的 路 径 , 其 中 ,Java 编译 器 (javac. exe) 保存 
在 WJAVA_HOME%\bin 中 ,Java 解释 器 (java. exe) 保 存在 WJAVA_HOMEW%\jre\bin 
中 ,要 在 任何 路 径 下 使 用 javac. exe 和 java. exe, 必 须 将 上 述 路 径 定 义 在 操作 系统 的 Path 环 
境 变量 中 。 

说 明 : 在 CLASSPATH 和 了 PATH 环境 变量 的 配置 中 ,%...% 表 示 一 个 操作 系统 的 环 
境 变量 。“; ”用 于 分 割 不 同 的 目录 路 径 , 也 就 是 说 ,如 果 要 设置 多 个 查找 路 径 , 路 径 之 间 需 
要 用 分 号 (;) 分 开 ,“. ”代表 当前 路 径 。 

要 设置 上 述 环境 变量 ,需要 通过 控制 面板 中 的 “系统 ”程序 来 完成 ,具体 步 又 如 下 : 

在 Windows“* 控 制 面板 ”中 ,双击 “系统 "图标, 打开 “系统 属性 ”对 话 框 。 选 择 “ 高 级 ” 选 
项 卡 , 如 图 2-28 所 示 。 单 击 “ 环 境 变 量 ” 按 钮 ,打开 “环境 变量 ”对 话 框 ,如 图 2-29 所 示 。 


cal Settings\Tenp 


图 2-28 “系统 属性 ”对 话 框 图 2-29 “环境 变量 "对话 框 


在 “环境 变量 ”对话 框 中 的 “系统 变量 "选项 组 中 ,可 以 新 建 环境 变量 ,或 者 对 已 经 存在 的 
环境 变量 进行 修改 。 
(1) 设置 JAVA_HOME 环境 变量 。 在 “系统 Fe 
变量 ”选项 组 中 , 单 击 “ 新 建 " 按 钮 ,打开 “新 建 系统 
变量 ”对话 框 ,从 中 输入 要 新 建 的 系统 变量 以 及 变 
量 值 ,如 图 2-30 所 示 。 [ am | 
输入 完成 后 , 单 击 “确定 "按钮 。 
(2) 设置 CLASSPATH 环境 变量 。 用 同样 的 。 图 2-30 新 建 系统 变量 JAVA_HOME 


Q@ jar 的 全 称 是 JavaTM Archive (JAR) file, 是 java 存档 文件 ,主要 压缩 存储 Java 的 class 文件 。Jar 是 JavaJDK 
中 的 命令 ,可 以 在 DOS 提示 符 下 ,使 用 jar -help 命令 显示 jar 的 使 用 方法 。 
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方法 ,新建 系统 变量 CLASSPATH ,如 图 2-31 所 示 。 

(3) 更 新 PATH 路 径 设置 。 在 “环境 变量 ”对 话 框 中 的 “系统 变量 ”选项 组 中 ,选择 
PATH 环境 变量 , 单 击 “编辑 ”按钮 ,在 原 有 PATH 基础 上 ,增加 “;%JAVA_HOME%\ 
bin; %JAVA_HOME%\jre\bin”, 如 图 2-32 所 示 。 


ICLASSPATH 
变量 值 轨 - TAVA_HOMEXNLib| men 


Cu ] ws | 


m32 woen :XTAVA_HOMEXNbin: XTAVA_HONE 
| 


2-31 新 建 系统 变量 CLASSPATH 图 2-32 更 新 系统 变量 PATH 


4. 测试 Java 运行 环境 


设置 完成 后 ,重新 启动 计算 机 ,使 上 述 设 置 生效 。 然 后 在 DOS 提示 符 下 ,依次 输入 下 述 
命令 来 检查 环境 变量 的 设置 情况 : 
c:\> echo % java home% 


Cc:\> echo % classpath% 
C:\> echo % path% 


也 可 以 通过 set 志 环境 变量 名 二 命令 来 检验 上 述 设 置 。 如 果 设 置 正 确 , 可 以 输入 下 列 命 
令 检查 Java 的 运行 是 否 正常 。 

c:\> java — version 

c:\> javac 

输入 上 述 命令 后 ,运行 结果 如 图 2-33 所 示 。 

如 果 能 运行 Java 编译 命令 javac, 表 明 Java 的 环境 变量 设置 没有 问题 。 接 下 来 可 以 用 
一 个 简单 的 java 程序 来 测试 J]2SDK 的 安装 ,代码 如 下 : 

public class Test 

{ 

public static void main(String args[]) { 
System. out. println( "Hello, My Java program "); 


} 
} 


创建 文件 夹 D:\MyJava, 将 上 述 程序 代码 保存 在 该 文件 夹 下 ,文件 名 为 Test. java( 和 类 
名 一 致 ,包括 大 小 写 )。 然 后 打开 DOS 命令 提示 符 窗口 , 转 到 Test. java 所 在 目录 D:\ 
MyjJava, 然 后 输入 下 面 的 命令 : 


javac Test. java 
java Test 


如 果 显 示 “Hello,My Java program”, 表 明 Java 环境 安装 成 功 , 用 dir 命令 可 看 到 生成 
一 个 Test. class 的 文件 ; 否则 需要 仔细 检查 环境 配置 情况 。 
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EE EE | 


Dl 


和 机 


全 
>[.《class2>。 


SRdministratoryjava -version 


-hb@5> 
Java HotSpotCTH> Client UM Chuild 1.6.9_93-b85。mixed node, shari 


IC:\Docunents and Settings\hdministrator》 


检验 Java 运行 情况 


2.5.5 Tomcat 的 安装 和 配置 


录 Tomcat 官方 网 站 http://tomcat. apache. org/ ,在 Download 区 域 , 单 击 
Tomcat 6. x 超 链接 ,显示 Tomcat 6. x 的 下 载 界面 ,在 Tomcat 6.0. 14 的 二 进 制 代码 发 布 
(Binary Distributions) 区 域 , 单 击 “Windows Service Installer (pgp，md5)” 超 链接 , 即 可 下 
载 Tomcat 安装 程序 ,文件 名 为 apache-tomcat-6. 0. 14. exe。 


1. 安装 步骤 


执行 Tomcat 安装 程序 apache-tomcat-6. 0. 14. exe, 启 动 安装 向 导 , 按 照 向 导 提 示 执 行 
下 面 的 步骤 。 

(1) 选择 要 安装 的 Tomcat 组 件 , 如 图 2-34 所 示 

在 安装 类 型 下 拉 列 表 框 中 ,选择 完全 安装 (Full) ,Tomcat 将 作为 Windows 服务 器 的 服 
务 直 接 启动 。 

(2) 选择 安装 的 物理 路 径 ,默认 路 径 为 C:\Program Files\Apache Software Foundation 
\Tomcat 6.0, 如 图 2-35 所 示 。 

为 下 一 步 配置 环境 变量 方便 ,我们 修改 安装 路 径 为 C:\Tomcat 6.0 

(3) 进行 Tomcat 的 基本 配置 ,包括 HTTP 端口 .Tomcat 的 默认 值 为 8080, 可 以 修改 


59 


本 和 加 
meop Web 技 术 导 论 (第 3 版 ) 


Nalsoft Install 


Choose Install Location 


Choose the Folder in which to instal Apache Tomcat, 


图 2-35 选择 Tomcat 安装 路 径 


为 80; 管理 员 的 登录 名 和 密码 ,默认 登录 名 为 admin, 密 码 可 以 为 空 , 如 图 2-36 所 示 。 

对 于 Tomcat 的 端口 号 ,因为 默认 的 Web 服务 器 配置 是 Apache 十 Tomcat, 因此 ， 
Tomcat 的 默认 端口 设置 并 不 是 80, 而 是 8080, Apache 也 正 是 通过 8080 这 个 端口 和 
Tomcat 进行 通信 的 。 因 此 ,如 果 服 务 器 配置 了 Apache, 此 时 ,不 要 修改 Tomcat 端口 号 ,使 
用 默认 的 8080。 如 果 服 务 器 不 安装 Apache, 只 是 用 Tomcat 本 身 , 可 以 修改 端口 号 为 80 或 
其 他 。 

(4) 选择 安装 Java Virtual Machine 的 物理 路 径 。 如 果 已 经 成 功 配 置 完 毕 JDK ( 含 
JRE) ,向 导 直 接 指向 J2SDK 中 安装 的 JRE 目录 ,例如 C:\JavaNjrel. 6.0 .03, 如 图 2-37 
所 示 。 


第 2 章 ”Web 服务 器 的 架设 和 管理 


图 Apache Tomcat Setup: Configuration Options 


Configuration 
Tomcat basic configuration, 


HTTPIL,1 Connector Port 


Administrator Login 


Lser Name 


Password 


Java Virtual Machine 
Java Virtual Machine path selection, 


Please select the path of 3 J25E 5,0 JRE nstaled on your system; 


Nolsoft Irstal Systen V2 2 


2-37 指向 JRE 路 径 


单 击 Install 按钮 ,开始 安装 ,向 导 将 把 有 关 的 文件 复制 到 相关 的 目录 下 ,并 自动 启动 
Tomcat。Tomcat 安装 完成 后 ,在 “开始 ”菜单 的 “程序 ”组 中 ,将 增加 Apache Tomcat 6 程 
序 组 。 

(5) 测试 安装 是 否 成 功 。 打 开 正 浏览 器 ,在 地 址 栏 中 输入 http://127. 0. 0. 1:8080/ 
(或 http://localhost:8080/) ,如 果 出 现 如 图 2-38 所 示 的 界面 , 则 表明 Tomcat 安装 成 功 。 

Tomcat 安装 完成 后 ,安装 程序 将 建立 相应 的 目录 ,所 建立 的 目录 结构 如 图 2-39 所 示 。 

不 同 的 Tomcat 版 本 ,安装 完成 后 的 文件 夹 结 构 不 同 。Tomcat 6. 0 的 文件 夹 结构 比 
Tomcat 5. 5 简单 ,各 文件 夹 及 其 功能 说 明 如 下 。 

(1) bin 目录 ,主要 存放 Windows 平台 上 启动 和 关闭 Tomcat 的 脚本 。 

(2) lib 目录 ,存放 Tomcat 服务 器 以 及 所 有 Web 应 用 都 可 以 访问 的 jar 文件。 为 了 在 
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Te t Iateraet Explorer 


Apache 
Tomcat 


fyou're seeingthis page via a web browser, it means you've 
setup Tomcat successfully. Congratulations! 


As you may have guessed by now, this is the default Tomcat home 
page. lt can be found on the local filesystem at 


SCATALINA HOME/webapps/ROoT/index.html 


Where "$CATALINA_HOME" is the root of the Tomcat installation 
directory. If you're seeing this page, and you don't think you should 
be, then either you're either a user who has arrived at new 

installation of Tomcat, or you're an administrator who hasn't got 
hisfher setup quite right. Providing the latter is the case, please 

refer to the Tomcat Documentation for more detailed setup and 
administration information than is found in the INSTALL file | 


图 2-38 Tomcat 安装 成 功 界面 


[eatalins policy 
Properties 


回 1oeeing properties 


tomcat-users. xml 


轩 回 eaples 
BD host-nanager 


日 加 catalina 
lcdhost 


辐 bost-nansger 
外 aase 


图 2-39 Tomcat 安装 目录 结构 
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java 环境 下 能 够 正确 编译 servlet 文件 ,最 好 把 lib 目录 中 的 jsp-api. jar 和 servlet-api. jar 复 
制 到 J2SDK 的 安装 目录 的 lib 子 目录 ( 即 c:\ Java\jrel. 6.0_03\lib) 内 ,同时 ,需要 在 
CLASSPATH 环境 变量 中 也 增加 这 两 个 .jar 文件 ( 即 在 原 变 量 后 面 输 入 *;c:\java\ jrel. 6. 
0_03\lib\jsp-api. jar; c:\ java\jrel. 3.0_03\lib\servlet-api. jar”) 。 

(3) conf 目录 ,存放 Tomcat 服务 的 配置 信息 文件 ,其 中 最 重要 的 是 server. xml 和 
web. xml。server. xml 是 Tomcat 的 主 配 置 文件 ,可 以 在 其 中 配置 Web 服务 的 端口 ,会 话 过 
期 时 间 、 虚 拟 目录 虚拟 主机 等 。web. xml 为 不 同 的 Tomcat 配置 的 Web 应 用 设置 默认 值 。 
另外 ,在 其 /Catalina/localhost 子 目 录 下 还 可 以 设置 网 站 虚拟 目录 和 根 路 径 信息 等 。 

(4) logs 目录 ,存放 Tomcat 执行 时 的 Log( 日 志 ) 文 件 。 

(5) temp 目录 ,存放 Tomcat 运行 的 一 些 临时 文件 。 

(6) webapps 目录 ,存放 Tomcat 服务 器 自 带 的 2 个 Web 应 用 host-manager 应 用 和 
manager 应 用 。ROOT 子 目 录 下 存放 默认 首页 , 即 输入 http://127. 0.0.1:8080/ 后 启动 的 
页 面 。 

(7) work 目录 ,存放 JSP 文件 在 运行 时 被 编译 成 的 二 进 制 文件 (Servlet) 。 在 localhost 
文件 夹 下 包含 多 个 子 文件 夹 ,其 中 第 一 个 文件 夹 "” 对 应 Web 服务 的 根 ,Tomcat 执行 主 
Web 应 用 的 jsp 页 面 时 生成 的 临时 文件 ,将 存储 在 “\Tomcat 6. 0\work\Catalina\localhost\_” 
文件 夹 中 。 其 他 文件 夹 分 别 对 应 虚拟 目录 ,每 建立 一 个 虚拟 目录 ,在 localhost 文件 夹 中 将 
创建 一 个 同名 的 子 文件 夹 。 用 户 可 以 删除 整个 localhost 子 文件 夹 ,来 删除 所 有 的 临时 
交 御 ， 

有 时 修改 页 面 内 容 后 ,仍然 显示 修改 以 前 的 内 容 ,这 时 可 以 尝试 把 work/Catalina/ 
localhost 目录 中 所 有 内 容 删除 。 如 果 删 除 时 出 现 无 法 删除 提示 ,需要 关闭 Tomcat, 然 后 再 
删除 。 重 启 Tomcat 即 可 正确 显示 修改 后 预期 的 内 容 。 

在 Tomcat 6.0 以 前 的 Tomcat 5. 5 中 ,有 三 个 不 同 的 lib 目录 ,分 别 存储 在 /server、 
/common 和 /shared 目录 下 ,这 些 lib 目录 都 可 以 放 jar 文件 。 它 们 的 区 别 主要 在 于 : 

(1) /server/lib 目录 下 的 jar 文件 只 可 被 Tomcat 服务 器 访问 ; 

(2) /common/lib 目录 下 的 jar 文件 可 以 被 Tomcat 服务 器 和 所 有 Web 应 用 访问 ; 

(3) /shared/lib 目录 下 的 jar 文件 可 被 所 有 Web 应 用 访问 ,而 不 能 被 Tomcat 服务 器 
访问 。 

在 用 户 自己 的 站 点 中 ,WEB-INF 目录 下 也 可 以 建 lib 子 目录 ,在 lib 子 目录 下 也 可 以 放 
各 种 jar 文件 ,但 这 些 jar 文件 只 能 被 当前 Web 应 用 访问 。 

接 下 来 即 可 进行 Tomcat 的 配置 .分 成 四 个 方面 : 根据 上 述 目 录 结 构 , 进 行 相应 的 环境 
变量 设置 ,配置 Tomcat 服务 端口 ,设置 Tomcat 服务 根 目 录 ,建立 虚拟 目录 。 


2. 配置 Tomcat 环境 变量 


Tomcat 为 JSP 的 容器 ,要 在 Windows 下 运行 JSP, 需 要 安装 Java 开发 环境 ,同时 需要 
一 些 特殊 的 环境 设置 ,包括 以 下 四 个 系统 环境 变量 ,具体 内 容 应 根据 安装 路 径 设置 。 
(1) 添加 Tomcat 主 目录 环境 变量 : 


TOMCAT HOME = C: \Tomcat 6.0 
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(2) 添加 CATALINA_HOME 环境 变量 : 
CATALINA HOME= C:\Tomcat 6.0 

(3) 更 新 CLASSPATH 环境 变量 : 

CLASSPATH = .; %JAVA HOMES \lib;% TOMCAT HOME % \lib 
(4) 更 新 PATH 环境 变量 : 

PATH = % PATHS% ; % TOMCAT HOME % ; % TOMCAT HOME % \bin 


上 述 环境 变量 的 配置 和 Java 环境 变量 的 配置 方法 相同 。 设 置 完 成 后 ,重新 启动 计算 
机 ,使 设置 生效 ,然后 再 启动 Tomcat。 

需要 特别 注意 的 是 ,如 果 该 步骤 的 环境 变量 配置 不 对 或 者 server. xml 文件 配置 不 对 
( 见 下 面 的 介绍 ) ,Tomcat 将 无 法 启动 。 另 外 ,如 果 Web 应 用 中 只 是 一 般 的 htm 文件 ,不配 
置 环 境 变量 ,网 站 也 可 以 浏览 ,因此 ,Tomcat 启动 后 ,并 不 意味 着 所 有 的 需要 运行 用 户 Web 
的 设置 都 完成 或 正确 。 

在 实际 应 用 中 ,一 般 需 要 更 改 三 个 基本 配置 : 修改 服务 端口 、 修 改 网 站 的 根 路 径 和 建立 
虚拟 目录 。 在 以 前 的 Tomcat 版 本 中 ,这 些 配置 比较 复杂 。 在 Tomcat 6.0 中 ,这 些 配置 都 
是 通过 Tomcat 主 配置 文件 conf/server. xml 完成 的 。 


3. 修改 服务 端口 


在 Tomcat 的 安装 过 程 中 ,可 以 设置 Tomcat 服务 端口 ,默认 值 为 8080。 安 装 完成 后 ， 
如 果 需 要 修改 服务 端口 ,可 通过 Tomcat 主 目录 下 的 conf 目录 中 的 server. xml 文件 完成 。 
不 同 的 Tomcat 版 本 , 主 配置 文件 Server. xml 的 内 容 不 同 。 

对 于 Tomcat 6. 0. x, 利 用 UltraEdit 或 其 他 文本 编辑 器 打开 \Tomcat 6. 0\conf\ 目 录 下 
的 server. xml 文件 ,定位 元 素 二 Connector port 王 "8080" 二 ,可 以 看 到 Tomcat 服务 的 设置 
端口 为 8080, 如 图 2-40 所 示 。 


a3 日 <1-- A "Connector" represents an endpoint by which requests are received 
4 and responses are returned. Documentation ac : 

45 Java HTTP Connector: /docs/config/http.html (blocking 6 non-blocking) 
46 Java AJP Connector: /docs/config/ajp.html 

47 APR (HTTP/AJP) Connector: /docs/apr.html 

48 Define a non-SSL HTTP/1.1 Connector on port 6060 

49 = 

5o 日 <Connector porc=" 上 是 proro J 

51 ConnectionTimeout: 


Sz redirectport="844 


图 2-40 ” Tomcat 的 服务 端口 信息 


修改 Web 服务 端口 为 http 的 默认 端口 80。 注 意 ,如 果 是 在 Windows 平 台中 ,并 且 安 
装 了 IIS, 则 修改 的 端口 号 不 要 和 IIS 中 的 Web 服务 冲突 。 修 改 完毕 后 ,保存 该 文件 ,然后 
重启 Tomcat 服务 器 ,这 样 Tomcat 就 在 新 的 端口 提供 服务 了 。 


4. 修改 网 站 根 路 径 
不 同 的 Tomcat 版 本 ,设置 Web 应 用 根 的 方法 也 不 相同 。 在 Tomcat 5. 5. x 中 ,修改 网 
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站 根 路 径 的 方法 有 两 种 : 一 种 是 修改 C:\Tomcat 5. 5\conf\ 目 录 下 的 Tomcat 主 配置 文件 
server. xml, 一 种 是 建立 ROOT. xml 文件 。 在 Tomcat 6. 0.x 中 ,设置 Tomcat 根 的 方法 非 
常 简单 ,只 需要 修改 Tomcat 主 配置 文件 conf/server. xml 即 可 。 

用 记事 本 打开 Tomcat 主 配 置 文件 server. xml, 定 位 到 文档 尾部 的 二 Host 志 元素 ,添加 
一 个 上 下 文 元 素 ( 二 Context 二 ) ,来 设置 Tomcat 的 根 。 例 如 ,如 果 将 d:\GSL3. 0 设置 为 
Tomcat 的 根 ,设置 如 图 2-41 所 示 。 


E 
文件 里) 编辑 癸 】 格式 0) 查看 帮助 0 
<4-- Define the default virtual host 
Note: XML Schema validation will not work with Xerces 2.2. 
--> 
<Host nane="localhost” appBase="webapps"” 
unpackWhRs="true'” autoDeploy="true" 
xmlUalidation="false'” xmlNanespaceAware="false"> 


《+-- Singlesignon valve, share authentication between web applications 
Documentation at: /docs/config/valve.htnl --> 

《t+-- 

《<uUalue className="org.apache.catalina.authenticator .SingleSignOn" /> 


-> 


<t-- fccess log processes all example. 
Documentation at: /docs/config/valve.htnl --> 
Ce 
<ualue classNane="org.apache.catalina.valves.AccessLogUalve" directory="] 
prefix="localhost_access 10g." suffix=".txt" pattern="common" rest 


--> 
KContext path="" docBase= "“d:\6SL3.8" /> 
</Host> 
</Engine> 
</Service> 
</Server> 


图 2-41 设置 Tomcat 服务 的 根 


需要 特别 注意 的 是 ,Tomcat 区 分 大 小 写 ,二 Context 志 元素 的 第 一 个 字母 一 定 为 大 写 ， 
且 文 件 夹 名 称 大 小 写 也 必须 和 实际 一 致 。 修 改 完毕 后 ,在 任务 栏 上 停止 Tomcat, 再 重新 启 
动 , 打 开 浏 览 器 ,将 运行 根 中 的 index. jsp 程序 页 面 。 

如 果 还 要 建立 虚拟 目录 ,只 需要 再 增加 不 同 的 二 Context 之 元 素 即 可 ,详细 介绍 见 2. 5.7 
节 。 在 server. xml 中 ,可 以 设置 多 个 不 同 的 虚拟 目录 。 


5. 设置 Web 应 用 首页 


在 Windows IIS 中 ,可 以 设置 一 个 Web 站 点 的 首页 ( 即 : 登录 一 个 站 点 ,在 不 指定 下 载 
文件 时 默认 的 下 载 文档 ,一 般 是 存储 在 站 点 主 目录 下 的 index 文 件 )。 在 Tomcat 中 ,如何 设 
置 站 点 首页 呢 ? 

在 Tomcat 中 ,站 点 首页 是 通过 web. xml 文件 完成 的 , web. xml 文件 又 称 为 站 点 配置 
文件 。 在 每 一 个 Web 应 用 中 ,往往 在 主 目录 下 包含 一 个 WEB-INF 子 目 录 , 其 中 存储 了 该 
站 点 的 配置 文件 web. xml。 此 外 ,在 Tomcat 的 conf 文件 夹 下 也 包含 一 个 web. xml 文件 ， 
内 容 如 下 : 


1166 - <welcome— file- list> 
1167 <welcome — file> index. html </welcome - file> 
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1168 <welcome — file> index. htm </welcome — file> 
1169 < welcome 一 file> index. jsp </welcome — file> 
1170 。 </welcome 一 file- list> 

1171 


1172 </web- app> 


Tomcat 的 conf/web. xml 文件 是 对 所 有 Web 应 用 的 一 个 公共 配置 。 对 于 一 个 具体 的 
Web 应 用 ,如 果 包 含 自己 的 WEB-INF/web. xml 文件 , 当 两 个 配置 冲突 时 , 则 自己 的 web. 
xml 配置 将 覆盖 conf/web. xml 中 的 设置 。 一 般 情况 下 ,只 需要 修改 conf/web. xml 配置 文 
件 即 可 ,不 需要 单独 设置 每 一 个 应 用 的 WEB-INF/web. xml 文件 。 


2.5.6 建立 并 部 署 Web 应 用 


在 默认 情况 下 , Tomcat 指向 一 个 默认 的 Web 应 用 (\Tomcat 6. 0\webapps\ROOT) ,在 
webapps 文件 夹 下 ,还 包含 其 他 的 几 个 Web 应 用 ,如 jsp-examples .servelets-examples 等 。 
下 面 介 绍 在 Tomcat 下 新 建 Web 应 用 的 方法 和 步骤 。 


1. 规划 Web 应 用 目录 结构 


对 于 一 个 Web 应 用 ,包含 了 大 量 的 网 页 文件 ,为 了 更 好 地 管理 和 维护 。 应 该 按照 一 定 
的 规则 组 织 文件 。 常 用 的 方法 是 按照 Web 站 点 功能 建立 文件 夹 , 分 别 存储 相应 的 页 面 文 
件 。 图 2-42 是 我 们 根据 一 个 常用 的 Web 应 用 规划 的 文件 夹 结构 。 


EC23 YY olxl 
文件 四 编 各 E) 查看 凡 收 疗 人 ) 工具 TD) 帮助 0 下 2 
GO ue x | 


文件 来 2 
a| Oin 文件 赤 。。 2006-4-17 9:59 
C iatabase 文件 亚 。。 2008-4-17 9:52 
. 忆 jp Dinsees 文件 来 2008-4-17 9:52 
回 images Drytbs 文件 夹 2008-4-17 9:59 
EDs 局 "rbloe= 文件 亦 2008-4-17 10:00 
局 inagss 局 wmesssage 文件 殉 2008-4-17 10:00 
EI= Bryonine 文件 2008-4-17 10:00 
田 忆 wymessage pubess 文件 2008-4-17 10:04 
田 回 wyonline 局 YE 文件 来 2008-4-17 9:51 
DB pmbess 国 inaex. ja 5 到 JSP 文件 2007-12-11 15:16 
E 国 testl.jsp 1 到 JSP 文件 2006-2-29 10:16 


国 test2 jsp 2 好 JSP 文件 ”2006-3-3 10:14 
国 test3. jsp 1 至 JSF 文件 。” 2008-3-7 19:05 


2-42 ”Web 应 用 目录 结构 示例 


将 每 一 类 功能 相关 的 页 面 .图 片 组 织 到 一 个 文件 夹 中 ,例如 mybbs、myblogs、myonline 
等 ,在 这 些 文件 夹 中 ,还 可 以 定义 子 文件 夹 ,例如 定义 images 文件 夹 ,存储 所 用 到 的 图 片 。 
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在 站 点 主 目录 下 ,通常 还 可 以 定义 database 文件 夹 ,存储 站 点 数据 库 文件 。 定 义 pubcss 文 
件 夹 ,存储 用 户 定 义 的 样式 表 。 

当然 ,还 有 一 个 WEB-INF 文件 夹 ,存储 Web 应 用 的 配置 文件 web. xml 以 及 定义 
classes 和 lib 两 个 子 文件 夹 ,存储 Web 中 用 户 定义 的 类 。 用 户 定义 的 大 量 的 JavaBean 都 是 
存储 在 WEB-INF/classes 文件 夹 中 的 ,里 面 通常 还 定义 不 同 的 包 , 即 子 文件 夹 。 

在 站 点 主 目录 中 ,包含 了 Web 应 用 的 首页 文件 index. jsp, 也 可 以 包含 一 些 其 他 的 常用 
文件 ,这 些 文件 通常 是 公用 的 ,不 便于 保存 到 一 个 具体 的 功能 文件 夹 中 。 


2. WEB-INF 目录 


在 Tomcat 中 ,每 一 个 Web 应 用 , 主 目录 下 往往 都 包含 一 个 WEB-INF 目录 ,用 于 放置 
一 些 配 置 文件 与 不 希望 外 部 程序 访问 的 隐私 文件 ,在 网 络 上 是 不 允许 访问 该 文件 夹 的 。 在 
WEB-INF 目录 下 有 一 个 Web 应 用 部 署 文 件 web. xml, 对 当前 应 用 程序 进行 相关 设置 ,如 
设置 Web 应 用 的 默认 首页 文件 等 。 

在 WEB-INF 目录 下 还 可 以 创建 classes 和 lib 子 目 录 。classes 目录 用 于 放置 Web 应 
用 程序 所 需 调用 的 类 ,如 JavaBean。 在 运行 过 程 中 ,Tomcat 类 装载 器 先 装载 classes 目录 下 
的 类 ,再 装载 lib 目录 下 的 类 。 如 果 两 个 目录 下 存在 同名 的 类 ,classes 目录 下 的 类 具有 优先 
权 。lib 目录 主要 是 放置 需要 引入 的 jar 文件 ,应 用 程序 导入 的 包 先 从 这 里 开始 寻找 ,其 次 到 
容器 的 全 局 路 径 下 $TOMCAT_HOME/lib 下 寻找 。 


3. Web 应 用 配置 文件 web. xml 


对 Web 应 用 的 配置 是 通过 Web 应 用 配置 文件 web. xml 实现 的 ,类 似 于 Windows IIS 
中 的 站 点 属性 对 话 框 的 配置 。 在 Tomcat/conf 下 包含 一 个 Web 应 用 配置 文件 web. xml, 它 
是 所 有 Web 应 用 的 公共 配置 文件 。 此 外 ,在 每 一 个 Web 应 用 中 ,在 主 目录 下 的 WEB-INF 
子 目 录 中 ,都 包含 一 个 web. xml 文件 , 它 是 该 Web 应 用 的 部 署 文件 。 当 两 个 配置 中 的 项 目 
冲突 时 , 则 自己 的 web. xml 配置 将 覆盖 conf/web. xml 中 的 设置 。 

在 web. xml 配置 文件 中 , 根 元 素 是 二 web-app 二 ,其 中 定义 了 站 点 的 各 种 配置 ,主要 包 
括 以 下 几 个 方面 。 

(1) 网 站 名 称 和 说 明 。 包 括 三 个 xml 元 素 ,分 别 是 二 description 二 、 一 display-name 二 、 
去 icon 二 ,用 于 设置 站 点 的 描述 .显示 名 称 和 图 标 。 例 如 , Tomcat 自 带 的 manger 应 用 的 
web. xml 中 的 站 点 说 明 xml 元 素 内容 如 下 : 


< display- name > Tomcat Manager Application </display- name> 
< description> 
A scriptable management web application for the Tomcat Web Server; 
Manager lets you view, load/unload/etc particular web applications. 
</description> 


(2) Servlet 的 名 称 和 映射 。servlet-mapping 元 素 包 含 两 个 子 元 素 servlet-name 和 url- 
pattern ,用 来 定义 servlet 所 对 应 的 URL。 

(3) Session 的 设 定 。session-config 包含 一 个 子 元 素 session-timeout, 用 于 定义 Web 
站 点 中 的 session 参数 。 例 如 , 设 定 会 话 时 间 为 20 分 钟 ,对 应 的 xml 元 素 内 容 为 : 
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< session - config> 
< session 一 timeout > 20 </session 一 timeout> 
</session - config> 


(4) mime 映射 。mime-mapping 包含 两 个 子 元 素 extension 和 mime-type, 定 义 某 一 个 
扩展 名 和 某 一 MIME Type? 映射 。 例 如 : 要 在 Tomcat 中 打开 excel 文件 ,需要 在 web. 
xml 中 做 如 下 设置 : 


<mime— mapping> 

< extension > xls </extension > 

<mime - type> application/vnd. ms — excel </mime — type> 
</mime 一 mapping> 
<mime— mapping> 

< extension > csv</extension > 

<mime - type> application/vnd. ms - excel </mime - type> 
</mime — mapping> 


(5) 错误 人 处理 。error-page 元 素 包 含 三 个 子 元 素 error-code、exception-type 和 
location, 将 错误 代码 (Error Code) 或 异常 (Exception) 的 种 类 对 应 到 Web 站 点 的 相应 页 面 。 
例如 : 

<error - page> 

<error — code> 404 </error - code> 


< location >/error404. jsp </location> 
</error - page> 


(6) 默认 首页 设置 。 对 应 的 元 素 声明 一 般 形式 为 : 


<welcome -file— list> 
< welcome - file> index. html </welcome - file> 
< welcome 一 file> index. htm </welcome — file> 
< welcome - file> index. jsp </welcome — file> 
</welcome - file— list> 
一 般 情况 下 ,只 需要 配置 Tomcat 的 conf/web. xml 公共 配置 文件 即 可 ,不 需要 为 每 一 
个 Web 应 用 配置 其 WEB-INF/web. xml 文件 。 


4. 修改 Tomcat 配置 


在 测试 Web 应 用 之 前 ,需要 对 Tomcat 做 相应 的 设置 ,使 得 Tomcat 指向 用 户 的 Web 
应 用 (例如 D:\MyJSP) ,修改 如 下 。 

(1) 修改 Tomcat 主 配置 文件 \Tomcat 6. 0\conf\server. xml, 设 置 Web 服务 的 端口 号 
为 80, 同 时 ,修改 默认 Tomcat 服务 的 根 ,在 server. xml 的 尾部 ,添加 下 列 元 素 ( 图 2-40): 


< Context path = "" docBase = "d:\MyJSP" /> 


(2) 设置 站 点 首页 ,可 以 修改 Tomcat 配置 文件 \Tomcat 6.0\conf\web. xml, 设 置 Web 


@ MIME 类 型 就 是 设 定 某 种 扩展 名 的 文件 用 一 种 应 用 程序 来 打开 的 方式 类 型 , 当 该 扩展 名 文件 被 访问 的 时 候 , 浏 
览 器 会 自动 使 用 指定 应 用 程序 来 打开 。 多 用 于 指定 一 些 客户 端 自 定义 的 文件 名 ,以 及 一 些 媒体 文件 打开 方式 。 
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应 用 的 一 些 常 用 配置 ,默认 首页 为 index. jsp, 无 须 修改 。 
需要 注意 的 是 ,如 果 已 经 启动 了 Apache Server, 首 先 应 该 在 Windows 的 “开始 ”菜单 
中 ,在 “程序 ”组 中 找到 Apache HTTP Server 程序 组 ,执行 Stop 命令 ,停止 Apache Server。 


5. 测试 新 的 Web 应 用 


当 上 述 修 改 完毕 后 ,在 任务 栏 中 右 击 Tomcat 图 标 二 ,选择 Shutdown:Tomcat 命令 , 关 
闭 Tomcat。 然 后 在 “开始 "菜单 中 重新 启动 Tomcat, 尝 试 运行 用 户 Web 应 用 。 
在 站 点 根 下 ,建立 一 个 简单 的 站 点 首页 文件 index. jsp, 代 码 如 下 : 


< 外 四 page contentType = "text/html;charset = gb2312" %> 
<html> 
<head> 
<title> Hello, JSP </title> 
</head> 
<body> 
<palign= "center"><$% out.println(" 你 好 , JSP...!"); %></p> 
<% 
String datestr =""; 
java. util. Date now = new java.util.Date() ; 
java. text. DateFormat df = new java. text.SimpleDateFormat("yyyy— MM— dd HH:mm") ; 
datestr = df.format(now) ; 
先 > 
现在 的 时 间 是 : <% = datestr %> 
</body> 
</html > 


打开 IE 浏览 器 ,输入 http://127. 0. 0.1:8080/1.jsp, 显 示 如 图 2-43 所 示 。 


马 Hello，JSP - Microsoft Internet Explorer 弃 | 右 | 网 
文件 EE) 编辑 E) 查看 如 收藏) 工具 GD) 帮助 人 0 


你 好 ，JSP...1 


现在 的 时 间 是 ，2011-12-14 11:23 


图 2-43 第 一 个 JSP Web 应 用 首页 


表明 Tomcat 已 经 运行 了 用 户 的 Web 应 用 D:\My]JSP 目录 下 的 首页 文件 index. jsp。 
用 户 可 以 在 主 目录 下 创建 其 他 的 jsp 文件 ,在 IE 的 地 址 栏 中 输入 http://127. 0. 0. 1:8080/ 
文件 名 (包含 扩展 名 ) 即 可 执行 相应 的 jsp 文件 。 

如 果 jsp 文件 中 含有 Java 脚本 程序 ,必须 要 保证 Tomcat 和 J2SDK 的 环境 变量 设置 正 
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确 , 和 否则 Web 应 用 将 不 能 和 运行。 如果 Web 页 是 . htm 文件 ,运行 与 环境 变量 的 配置 无 关 。 

在 应 用 中 ,如 果 遇 到 不 能 打开 Web 应 用 首页 文件 index. jsp ,应 检查 该 Web 应 用 主 目 
录 下 的 WEB-INF\ web. xml 配置 文件 ,同时 检查 Tomcat 下 的 公共 配置 文件 conf\ web. 
xml, 确 认 两 者 是 否 配置 一 致 。 如 果 修 改 了 某 个 jsp 页 面 ,但 重新 运行 仍 显示 原先 内 容 , 需 要 
删除 Tomcat\work\Catlinia\localhost 中 的 所 有 临时 文件 ,也 可 以 直接 删除 localhost 子 文 
件 严 。 


2.5.7 Apache 和 Tomcat 的 整合 


通过 上 一 节 的 介绍 ,我 们 已 经 非常 清楚 Apache 和 Tomcat 的 功能 , 即 Apache 是 一 个 
Web 服务 器 ,Tomcat 为 应 用 服务 器 。 虽 然 Tomcat 内 置 了 一 个 Apache 的 HTTP 服务 ,但 
是 它 仅仅 对 JSP 程序 体现 出 比较 好 的 执行 效率 和 性 能 ,对 于 静态 页 面 的 处 理 速 度 远 不 如 
Apache。 

可 见 , 为 了 提高 Web 系统 的 整体 性 能 ,需要 将 Apache 和 Tomcat 进行 整合 配置 。 假 
设 , 系 统 已 经 成 功 安装 了 Apache( 端 口号 为 80) 和 Tomcat 服务 器 (端口 号 为 8080) ,未 作 特 
殊 配置 ,要 将 两 者 进行 有 机 整合 ,可 以 分 为 以 下 三 个 方面 。 

在 示例 站 点 d:/haosite 中 ,新建 一 个 index. jsp 首页 文件 ,代码 同上 。 修 改 Apache 主 
配置 文件 httpd. conf, 设 置 Apache 服务 器 的 首页 为 index. jsp。 操 作 如 下 。 

用 记事 本 打开 Apache 主 配置 文件 httpd. conf, 找 到 首页 配置 指令 段 : 

< IfModule dir _ module> 

DirectoryIndex index. html index. jsp 

</IfModule> 

将 默认 的 index. html 改 为 index. jsp。 

重新 启动 Apache, 打 开 浏 览 器 ,在 地 址 栏 中 输入 http://127.0.0.1/, 页 面 中 没有 显示 
当前 时 间 ,可见 ,服务 器 页 中 的 脚本 程序 未 执行 。 

然后 ,在 浏览 器 地 址 栏 中 输入 http://127. 0.0.1:8080/, 则 能 够 正确 显示 页 面 (图 2-43)， 
可 见 ,Tomcat 能 够 提供 Web 服务 ,同时 ,Tomcat 执行 了 服务 器 页 中 的 脚本 程序 。 

整合 Apache 2.2 和 Tomcat 6.0 就 是 要 保证 Apache 执行 Web 服务 ,并 实时 调用 Tomcat 
执行 服务 器 页 面 中 的 脚本 程序 。 要 进行 Apache 和 Tomcat 的 整合 ,可 以 采用 三 种 方法 。 

(1) 利用 Apache 自 带 的 mod_proxy 模块 使 用 代理 技术 来 连接 Tomcat。http_proxy 
模式 是 基于 HTTP 的 代理 ,因此 它 要 求 Tomcat 必须 提供 HTTP 服务 ,也 就 是 说 必须 启用 
Tomcat 的 HTTP Connector。 

打开 Apache 配置 文件 httpd. conf 文件 ,找到 如 下 代码 : 

# LoadModule proxy_module modules/mod_proxy. so 

#LoadModule proxy_http_module modules/mod_proxy_http. so 

将 注释 去 掉 , 即 可 启用 proxy_module 和 proxy_http_module。 

然后 ,在 Apache 的 httpd. conf 文件 中 增加 如 下 两 行 : 


ProxyPass / http://localhost:8080/ 
ProxyPassReverse / http://localhost:8080/ 


第 2 章 ”Web 服务 器 的 架设 和 管理 


重启 Apache, 就 可 通过 Apache 来 访问 Tomcat 的 服务 了 。 

(2) ajp_proxy 连接 方式 。 跟 http_proxy 方式 一 样 ,都 是 由 mod_proxy 所 提供 的 功能 。 
配置 也 是 一 样 ,只 需要 把 http:// 换 成 ajp://, 同 时 连接 的 是 Tomcat 的 AJP Connector 所 
在 的 端口 。 配置 如 下 。 

在 Apache 中 修改 httpd. conf 文件 ,找到 如 下 代码 : 


#LoadModule proxy_module modules/mod_proxy. so 
#LoadModule proxy_ajp_module modules/mod_proxy_ajp. so 


将 注释 去 掉 , 启 用 proxy_module 和 proxy_ajp_module。 
在 Apache 的 httpd. conf 文件 中 增加 以 下 几 行 代码 。 


# 禁 止 使 用 proxy_ajp 代理 的 目录 

ProxyPass /examples/ ! 

# 使 用 proxy_ajp 代理 ; 下 面 的 配置 ,是 把 所 有 目录 全 用 代理 (当然 ,还 会 跟 上 面 的 禁用 配置 组 合成 

完整 的 规则 ) 

ProxyPass / ajp://127.0.0.1:8009/ 

ProxyPassReverse / ajp://127.0.0.1:8009/ 

重启 Apache, 就 可 通过 Apache 来 访问 Tomcat 的 服务 了 。 

(3) 通过 JK 模块 整合 ,配置 需要 安装 JK, 修 改 Apache 服务 器 的 配置 文件 httpd. conf， 
加 载 JK 模块 以 及 指定 JK 配置 文件 信息 。 

@ workers. properties: 到 Tomcat 服务 器 的 连接 定义 文件 。 

@ uriworkermap. proprties: URI 映射 文件 ,用 来 指定 哪些 URL 由 Tomcat 处 理 , 也 
可 以 直接 在 httpd. conf 中 配置 这 些 URI, 但 是 独立 这 些 配置 的 好 处 是 JK 模块 会 定期 更 新 
该 文件 的 内 容 ,使 得 修改 配置 时 无 须 重新 启动 Apache 服务 器 。 

相对 于 上 面 的 方法 (1) 和 方法 (2) ,该 方法 配置 麻烦 ,但 效率 较 高 ,详细 介绍 略 。 

采用 上 述 任何 一 种 方法 ,配置 完成 后 ,在 浏览 器 地 址 栏 中 输入 http://127. 0. 0. 1/ ,显示 
结果 页 面 和 http://127.0.0.1:8080/ 相 同 , 则 表明 整合 成 功 , 此 时 Apache 调用 了 Tomcat， 
执行 服务 器 页 面 中 的 jsp 服务 器 脚本 程序 。 


@.6 虚拟 主机 与 虚拟 目录 


在 Web 站 点 的 配置 中 ,虚拟 目录 和 虚拟 主机 是 两 种 常见 的 配置 ,无 论 是 Windows 
Server /IIS 还 是 Apache/Tomcat ,都 可 以 配置 虚拟 目录 和 虚拟 主机 。 虽 然 其 配置 方法 不 尽 
相同 ,但 其 基本 概念 是 一 样 的 ,本 节 将 以 Apache/Tomcat 为 例 , 介 绍 虚拟 目录 、 虚 拟 主机 的 
概念 及 其 配置 方法 。 


2.6.1 虚拟 主机 及 其 配置 


在 同一 台 Web 服务 器 上 运行 多 个 网 站 的 技术 称 为 虚拟 主机 。 使 用 虚拟 主机 ,可 以 让 多 
个 站 点 共享 同一 台 物 理 机 器 ,减少 系统 的 运行 成 本 ,并 且 可 以 减少 管理 的 难度 。 此 外 ,对 于 
个 人 用 户 , 也 可 以 使 用 这 种 虚拟 主机 方式 来 建立 有 自己 独立 域名 的 WWW 服务 器 。 
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1. 虚拟 主机 的 类 型 


虚拟 主机 分 为 基于 IP 的 虚拟 主机 和 基于 域名 的 虚拟 主机 两 种 形式 。 

1) 基于 IP 地 址 的 虚拟 主机 

所 谓 基 于 IP 地 址 的 虚拟 主机 方式 ,是 指 不 同 的 主机 名 解析 到 不 同 的 IP 地 址 ,提供 虚拟 
主机 服务 的 机 器 上 同时 设置 有 这 些 IP 地址。 在 具体 实现 中 ,如 果 每 个 虚拟 主机 (网 站 ) 使 用 
不 同 的 端口 号 , 则 每 台 虚 拟 主机 运行 一 个 Apache 服务 。 如 果 多 个 虚拟 主机 使 用 相同 的 端 
口号 ,不 同 的 主机 名 , 则 它们 将 共享 一 个 Apache 服务 。 

2) 基于 域名 的 虚拟 主机 

在 HTTP 1.1 中 增加 了 对 基于 主机 名 的 虚拟 主机 的 支持 。 具 体 说 , 当 客 户 程 序 向 
WWW 服务 器 发 出 请 求 时 ,客户 想 要 访问 的 主机 名 也 通过 请 求 头 中 的 "Host: ”语句 传递 给 
WWW 服务 器 。WWW 服务 器 程序 接收 到 这 个 请 求 后 ,可 以 通过 检查 "Host: "语句 ,来 判定 
客户 程序 请 求 的 是 哪个 虚拟 主机 的 服务 ,然后 再 进一步 地 处 理 。 

基于 域名 的 虚拟 主机 相对 比较 简单 ,因为 只 需要 配置 你 的 DNS 服务 器 将 每 个 主机 名 映 
射 到 正确 的 IP 地 址 ,然后 配置 Apache HTTP 服务 器 , 令 其 辨识 不 同 的 主机 名 就 可 以 了 。 
基于 域名 的 服务 器 也 可 以 缓解 IP 地 址 不 足 的 问题 。 如 果 没 有 特殊 原因 必须 使 用 基于 IP 的 
虚拟 主机 ,最 好 还 是 使 用 基于 域名 的 虚拟 主机 。 

但 是 ,基于 域名 的 虚拟 主机 配置 有 其 不 足 , 因 为 ,在 该 类 配置 中 ,多 个 网 站 共享 一 个 IP 
地 址 和 端口 ,多 个 虚拟 主机 使 用 一 个 Apache 服务 程序 ,各 个 虚拟 主机 共享 同一 份 Apache， 
因此 有 CGI 程序 运行 时 ,安全 性 不 高 。 


2. 虚拟 主机 的 设置 


设 有 两 个 公司 共享 一 台 Web 服务 器 ,公司 域名 分 别 是 www. companyl. com 和 www. 
company2. com。 两 公司 在 DNS 域名 注册 时 均 设 定 这 台 Web 服务 器 的 IP 地 址 。 该 Web 
服务 器 采用 基于 名 字 的 虚拟 主机 设置 。 

为 测试 方便 ,使 用 本 地 DNS 解析 机 制 ,在 Windows\system32\drivers\etc\hosts 文件 ， 
添加 上 述 的 域名 解析 ,IP 均 为 127. 0.0.1。 

在 Apache2 安装 目录 下 的 \conf\extra\ 文 件 中 ,找到 httpd-vhosts. conf 文件 ,进行 如 下 
配置 。 

(1) 为 每 个 虚拟 主机 建立 二 VirtualHost 二 段 : 

# ServerName 是 网 站 域名 ,需要 跟 DNS 指向 的 域名 一 致 

并 DocumentRoot 是 网 站 文件 存放 的 根 目 录 

<VirtualHost * :80> 

ServerName www. companyl. com 


DocumentRoot "D: /company1" 
</VirtualHost > 


如 果 想 在 现 有 的 Web 服务 器 上 增加 虚拟 主机 ,必须 也 为 现存 的 主机 建造 一 个 


所 VirtualHost 之 定义 块 。 这 个 虚拟 主机 中 ServerName 和 DocumentRoot 所 包含 的 内 容 应 
该 与 全 局 的 ServerName 和 DocumentRoot 保持 一 致 。 还 要 把 这 个 虚拟 主机 放 在 配置 文件 
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的 最 前 面 ,来 让 它 扮演 默认 主机 的 角色 。 
(2) 打开 httpd. conf 文件 , 开启 虚拟 主机 配置 文件 : 


# Virtual hosts 
Include conf/extra/httpd-vhosts. conf 


(3) 重启 Apache 服务 ,访问 虚拟 主机 。 

现在 Web 服务 器 上 有 三 个 站 点 , 即 : 中 心 主机 (Mainhost) ,在 httpd. conf 中 设置 的 
DocumentRoot "D:/haosite"; 虚拟 主机 www. companyl. com( 在 \conf\extra\httpd-vhosts. conf 
配置 ); 虚拟 主机 www. company2. com( 在 \conf\extra\httpd-vhosts. conf 配置 ) 。 

然后 就 可 以 通过 域名 www. companyl. com 和 www. company2. com 访问 companyl 
和 company2 两 个 虚拟 主机 了 。 如 果 没 有 进行 Apache 和 Tomcat 的 整合 ,将 不 运行 JSP 中 
的 服务 端 脚本 程序 ,但 能 够 返回 网 页 。 


3. Apache 与 Tomcat 虚拟 主机 一 致 


在 站 点 的 实际 运行 中 ,需要 Apache 和 Tomcat 的 融合 ,因此 只 配置 Apache 的 虚拟 主 
机 ,并 不 能 保证 整个 融合 的 有 效 运行 。 完 整 的 配置 总 结 如 下 。 
(1) 在 Apache 的 httpd. conf 配置 中 加 载 需要 的 代理 模块 ,取消 下 面 两 行 的 注释 : 


LoadModule proxy_module modules/mod_proxy. so 
LoadModule proxy_http_module modules/mod_proxy_http. so 


如 果 在 尾部 包含 下 述 指令 ,将 其 注释 掉 : 


#ProxyPass / http://localhost:8080/ 
#ProxyPassReverse / http://localhost:8080/ 


(2) 修改 httpd-vhosts. conf, 添 加 虚拟 主机 ,并 集成 Tomcat: 


NameVirtualHost * :80 
<VirtualHost * :80> 
ServerName www. companyl. com 
ProxyPass / http:// www.companyl. com:8080/ 
ProxyPassReverse / http:// www. companyl. com:8080/ 
</VirtualHost > 
NameVirtualHost * :80 
<VirtualHost * :80> 
ServerName www. company1. com 
ProxyPass / http:// www. company2. com:8080/ 
ProxyPassReverse / http:// www. company2. com:8080/ 
</VirtualHost > 


(3) 打开 httpd. conf 文件 , 开启 虚拟 主机 配置 文件 : 


# Virtual hosts 

Include conf/extra/httpd-vhosts. conf 

(4) 在 Tomcat 6.0 的 server. xml 中 定义 上 述 同 名 的 虚拟 主机 。 

圳 除 原先 的 二 host 二 定义 ,添加 新 的 虚拟 主机 定义 , 即 在 尾部 添加 两 个 二 Host 二 定义 ， 
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如 图 2-44 所 示 。 


目 server. xal -- 写 宁 板 
文件 下 ) 编辑 下 ) 查看 插入 I) 格式 中) 帮助 加 
口 确 罩 号 及 才 了 年 龟 一 戈 


<I-- Define the default virtual host 
Note: XML Schema validation will not work with Xerces 2.2. 


二 


《Host nane="www. company1. com”debug="0”unpackWhARs="true“》 
《Context path="” docBase="d:/companyl” debug="0" reloadable="true"/> 


WHost> 


《Host nane="www. conpany2. com” debug="0” unpackWARs="true”> 


Context path="” docBase="d:/company2” debug="0” reloadable="true"/> 
WHost> 


/Engine> 
/Service> 
/Server> 
围 | 
要 “帮助”, 请 按 Fl 


图 2-44 Tomcat 虚拟 主机 设置 


当 上 述 配置 结束 后 ,就 可 以 正确 地 访问 虚拟 主机 ,并 执行 Tomcat 了 。 例 如 在 浏览 器 地 
址 栏 中 输入 http://www. companyl. com/ ,显示 页 面 如 图 2-45 所 示 。 


Hello, JSP - Nicrosoft Internet E... |] 风 | 
文件 EE) 编辑 EF) 查看 收藏) 工具 I) 和 帮助” 

@ 扫 -日 " 国 国 多 亿 扫 家 次 收 天 包 

地 下 加 | 蜀 xttp:y/rr eonpanyl. con/ 


Company 1.. .欢迎 您 


现在 的 时 间 是 ，2011-12-15 13:55 


2-45 ”访问 Apache 虚拟 主机 


2.6.2 虚拟 目录 及 其 配置 


在 Web 站 点 中 ,站 点 内 容 是 由 站 点 主 目录 下 的 所 有 子 文件 夹 和 文件 构成 的 。 所 谓 “ 虚 
拟 目录 ”就 是 一 个 指向 站 点 主 目录 以 外 的 物理 目录 的 指针 ,理论 上 讲 , 该 文件 夹 不 属于 站 点 
的 一 部 分 ,但 为 了 通过 站 点 访问 到 该 文件 夹 的 内 容 , 就 在 站 点 根 下 创建 一 个 指向 该 外 部 文件 
夹 的 指针 , 即 虚拟 目录 ,以 便于 在 URL 中 书写 路 径 ,定位 其 中 的 文件 。 

设置 了 虚拟 目录 后 ,访问 该 Web 站 点 主 目录 外 的 文件 ,通过 使 用 虚拟 目录 即 可 定位 ,在 
浏览 器 地 址 栏 中 输入 http://127. 0. 0. 1/ 虚 拟 目录 /文件 名 。 


1. Tomcat 中 虚拟 目录 的 设置 


在 Tomcat 6.0 中 ,使 用 虚拟 目录 ,非常 简单 ,只 需要 修改 Tomcat 主 配置 文件 conf\ 
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server. xml, 在 尾部 增加 一 个 新 的 二 Context 二 元 素 即 可 。 例 如 ,建立 一 个 到 d:/haosite 的 
虚拟 目录 ,在 server. xml 中 ,在 根 目 录 设 置 的 后 面 ( 图 2-41) ,添加 下 述 内 容 : 

< Context path = "/hao" docBase = "d:\haosite" reloadable = "true" crossContext = "true" 

Debug = "0" workdir = "d:\haosite\work"> 

</Context> 

其 中 ,path 二 "/hao" 定 义 了 根 下 的 一 个 虚拟 目录 hao,docBase 王 "d:\haosite" 为 虚拟 目 
录 hao 对 应 的 物理 路 径 。 参 数 reloadable 设置 为 true, 表 明 修 改 Servlet 文件 ,jsp 文件 后 ， 
不 用 重启 Tomcat 即 可 生效 。 

保存 server. xml 文件 ,然后 重启 Tomcat 服务 器 ,可 以 在 地 址 栏 中 通过 虚拟 目录 访问 
d:/haosite 中 的 网 页 文件 了 ,例如 http://127.0.0.1/hao/index_hao. jsp。 

此 时 ,在 Tomcat 的 临时 文件 夹 C:\Tomcat 6. 0\work\Catalina\localhost 中 ,自动 创建 
一 个 与 虚拟 目录 同名 的 临时 文件 夹 hao, 存 储 该 虚拟 目录 生成 的 临时 文件 。 


2. Apache 中 虚拟 目录 的 设置 


在 Apache 的 配置 文件 httpd. conf 下 搜索 Directory, 得 到 Apache 虚拟 目录 例子 。 记 着 
开启 虚拟 主机 模块 。Apache 配置 虚拟 目录 分 三 种 情况 。 

(1) 如 果 未 配置 虚拟 主机 ,在 httpd. conf 中 , 建 一 个 虚拟 目录 elearning, 对 应 的 物理 目 
录 为 d:/hao/elearning。 配 置 如 下 : 


Alias /elearning "D:\hao\elearning" 
<Directory "D:\hao\elearning"> 
AllowOverride None 
Options None 
Order allow, deny 
Allow from all 
</Directory> 


(2) 如 果 Apache 配置 了 虚拟 主机 ,可 以 将 上 述 指 令 添加 到 httpd-vhosts. conf 虚拟 主 
机 的 声明 中 , 即 : 


<VirtualHost * :80> 
ServerName www. companyl. com 
DocumentRoot "D:/company1" 
ProxyPass / http://www. companyl. com:8080/ 
ProxyPassReverse / http://www. companyl. com:8080/ 


Alias /elearning "D:\hao\elearning" 
<Directory "D:\hao\elearning"> 
AllowOverride None 
Options None 
Order allow, deny 
Allow from all 
</Directory> 
</VirtualHost > 


(3) 如 果 Apache 已 经 和 Tomcat 进行 了 整合 ,还 需要 在 Tomcat 的 Server. xml 同时 为 
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虚拟 主机 添加 虚拟 目录 ,配置 如 下 : 


< Host name = "www. company1. com" debug = "0" unpackWARs = "true"> 
< Context path= "" docBase = "d:/company1" debug = "0" reloadable = "true"/> 
< Context path = "/elearning" docBase = "D:\hao\elearning" debug = "0" reloadable= "true"/> 
</Host> 
当 虚 拟 主机 /虚拟 目录 配置 完成 后 ,运行 Web 浏览 器 ,在 地 址 栏 中 输入 一 个 URL ,访问 
虚拟 目录 下 的 页 面 ,例如 http://www.companyl. com/elearning/1.jsp, 可 以 看 到 页 面 正 确 
显示 。 


@.3 Web 服务 器 的 远程 管理 与 维护 


随 着 互联 网 的 发 展 ,服务 器 的 远程 管理 成 为 最 主要 的 管理 模式 。 在 Windows Server 
2003 平台 中 ,只 要 在 服务 器 上 进行 相应 的 配置 ,就 可 以 实现 对 服务 器 的 远程 管理 。 


2.7.1 使 用 终端 服务 和 远程 桌面 


在 Windows Server 中 ,都 提供 了 终端 服务 组 件 。 因 此 ,管理 员 可 以 在 Windows 服务 器 
上 安装 Windows 服务 组 件 “ 终 端 服 务 ”" 和 “远程 桌面 Web 连接 ”, 然 后 管理 员 就 可 以 使 用 
Windows XP 中 的 “远程 桌面 连接 "(在 “附件 ”一 “通信 ”程序 组 中 ) ,来 登录 到 Web 服务 器 ， 
实现 对 服务 器 的 操作 。 

选择 “附件 ”一 “通信 ”一 “远程 桌面 连接 ”, 首 先 打 开 “ 远 程 桌面 连接 ”对 话 框 ,如 图 2-46 
所 示 。 


柜 远程 点 面 连接 


[ET | | 过 项 ) >>] 


图 2-46 “远程 桌面 连接 ”对 话 框 


输入 要 连接 的 计算 机 的 IP 地 址 , 单 击 “ 连 接 ” 按 钮 ,打开 “Windows 登录 ”对 话 框 ; 输入 
远程 计算 机 上 的 一 个 本 地 账户 和 密码 , 即 可 登录 到 远程 服务 器 ,显示 其 桌面 , 接 下 来 就 可 以 
如 在 本 地 一 样 对 远程 的 计算 机 进行 操作 和 管理 了 。 


2.7.2 基于 浏览 器 的 服务 器 远程 管理 


在 Windows Server 平台 中 ,在 IIS 中 ,在 “万 维 网 服务 "组件 中 ,包含 了 “远程 管理 
(HTML)” 子 组 件 , 安 装 该 组 件 后 ,可 以 对 Windows 服务 器 进行 远程 管理 。 

具体 设置 如 下 。 

(1) 在 “计算 机 管理 ”控制 台中 ,在 “服务 和 应 用 程序 ”节点 下 ,展开 “Internet 信息 服务 ” 
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管理 单元 。 
(2) 在 需要 远程 管理 的 Web 站 点 上 右 击 ,打开 快捷 菜单 ,执行 “属性 ”命令 ,打开 Web 
属性 对 话 框 。 在 Web 站 点 选项 卡 中 , 记 下 该 站 点 的 TCP 端口 号 。 
(3) 在 Web 站 点 属性 对 话 框 中 ,选择 “目录 安全 性 ”选项 卡 ,在 “IP 地 址 和 域名 限制 ? 选 
项 组 中 , 单 击 “ 编 辑 ” 按 钮 ,打开 “IP 地 址 和 域名 限制 ”对 话 框 ,执行 下 列 操作 之 一 。 
。 如 果 要 允许 所 有 计算 机 远程 管理 IIS ,选择 “授权 访问 ? 单 选 按钮 。 
。 选择 “拒绝 访问 " 单 选 按钮 ,然后 单 击 “ 添 加 ”按钮 ,打开 “授权 访问 ”对 话 框 ; 选择 要 
授权 访问 的 “单机 ”、“ 一 组 计算 机 ”或 者 “域名 ”, 按 照 系 统 提示 进行 操作 。 
当 Web 服务 器 上 启用 了 基于 浏览 器 的 Internet 服务 管理 器 (HTML) 后 ,就 可 以 使 用 
基于 浏览 器 的 Internet 服务 管理 器 了 。 
在 浏览 器 地 址 栏 中 输入 https://Web 服务 器 网 址 (域名 或 IP 地 址 ):8098/, 按 Enter 
建 ,显示 “连接 到 ”对话 框 ; 输入 一 个 管理 员 权 限 的 用 户 账户 和 和 密码, 则 打开 “服务 管理 ”站 
点 , 即 通 过 Web 接口 远程 维护 Windows Server 2003 服务 器 界面 ,如 图 2-47 所 示 。 
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图 2-47 通过 Web 接口 远程 维护 Windows Server 2003 服务 器 界面 


通过 Web 接口 ,可 以 实现 Windows Server 2003 服务 器 的 远程 维护 ,包括 站 点 、Web 服 
务 器 、 网 络 、 用 户 等 维护 功能 。 
2.7.3 网 站 内 容 的 远程 维护 


如 果 要 对 Windows 服务 器 平台 中 的 网 站 进行 远程 管理 ,可 以 有 很 多 方式 ,除了 上 述 几 
种 管理 方式 外 ,还 可 以 利用 FTP 和 FrontPage 等 进行 远程 管理 ,其 中 采用 FTP 管理 网 站 具 
有 更 好 的 通用 性 ,可 以 管理 各 种 类 型 的 网 站 ; 但 是 ,使 用 FrontPage 只 能 管理 IIS 中 的 网 站 ， 
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如 果 是 Tomcat 中 的 网 站 , 则 不 能 通过 FrontPage 来 管理 。 

使 用 FTP 管理 网 站 ,需要 对 Web 服务 器 进行 如 下 配置 。 

(1) 在 Web 服务 器 计算 机 上 搭建 一 个 FTP 站 点 ,设置 其 主 目录 为 要 管理 的 网 站 主 
目录 。 

(2) 用 户 登录 ftp 站 点 , 即 可 看 到 网 站 主 目录 , 接 下 来 就 可 以 对 网 站 进行 维护 操作 了 。 
例如 : 修改 网 页 ,首先 将 要 修改 的 网 页 下 载 ,修改 完毕 后 再 上 传 ,覆盖 原先 的 网 页 。 

可 见 ,该 方式 与 网 站 是 IIS 的 ,和 Tomcat 无 关 , 也 不 需要 对 要 管理 的 网 站 的 属性 进行 特 
殊 的 设置 ,只 需要 FTP 指向 站 点 主 目录 即 可 。 

对 网 站 的 远程 维护 还 可 以 通过 FrontPage、Dreamweaver 等 工具 来 完成 ,这 些 可 视 化 的 
网 页 制作 工具 ,目前 都 包含 站 点 远程 维护 功能 。 其 中 ,对 于 要 使 用 FrontPage 管理 的 网 站 ， 
不 仅 要 在 服务 器 端 添 加 FrontPage 扩展 ,还 必须 在 IIS 中 对 网 站 属性 进行 设置 ,可 见 
FrontPage 只 能 远程 维护 IIS 中 的 网 站 。 


体 章 小 结 


本 章 首先 介绍 了 操作 系统 、Web 服务 器 和 Web 应 用 开发 的 关系 ,然后 以 Windows 
Server/IIS 为 例 , 讲 解 了 Web 服务 器 的 安装 和 配置 过 程 ,介绍 了 其 中 的 概念 ,包括 端口 号 、 
主 目录 、 默 认 文 档 以 及 安全 性 等 。 在 此 基础 上 ,重点 讲解 了 Apache 服务 器 和 Tomcat 服务 
器 的 功能 、 安 装 和 配置 。 讲 解 了 Apache 服务 器 和 Tomcat 服务 器 的 关系 ,Tomcat 服务 器 与 
JSP Java 之 间 的 关系 以 及 Java 运行 环境 的 安装 和 环境 变量 配置 。 介 绍 了 虚拟 主机 和 虚拟 
目录 的 概念 ,讲解 了 Apache 和 Tomcat 中 虚拟 主机 和 虚拟 目录 的 配置 方法 。 最 后 ,对 Web 
站 点 的 远程 管理 和 内 容 维护 进行 了 介绍 。 


铝 题 2 


. 什么 是 Web 服务 器 ? 有 哪些 主流 的 Web 服务 器 产品 ? 

. 什么 是 IIS? IIS 6.0 包括 哪些 可 选 组 件 ? 简 述 它们 的 功能 。 

. 简 述 在 IIS 中 Web 站 点 的 创建 过 程 。 

. 在 Windows Server/IIS 中 , 当 连 接 新 建 的 Web 站 点 时 出 现 如 图 2-48 所 示 的 “输入 
网 络 密码 ?对话 框 ,为 什么 ”如 何 解决 ? 


入 


2-48 “输入 网 络 密码 "对话 框 
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5. 当 连 接 到 一 个 IIS 中 的 Web 站 点 ,浏览 一 个 ASP 页 时 ,显示 “网 页 无 法 显示 ”提示 页 
面 ,并 且 在 页 面 中 提示 “您 试图 从 目录 中 执行 CGIISAPI 或 其 他 可 执行 程序 ,但 该 目录 不 允 
许 执 行程 序 ”, 为 什么 ? 如 何 解 决 ? 

6. 简 述 Apache 服务 器 和 Web 服务 器 的 功能 。 

7. Java 运行 环境 包括 哪些 内 容 ? 安装 JDK 后 ,需要 设置 哪些 系统 环境 变量 ? 简 述 设 
置 每 个 环境 变量 的 目的 。 

8. 安装 一 次 Tomcat 6.0, 简 述 Tomcat 目录 结构 中 各 个 目录 的 功能 。 

9. 在 Web 应 用 中 , 简 述 WEB-INF 文件 夹 的 作用 ,Web 应 用 配置 文件 web. xml 的 功能 
是 什么 ? 

10. 什么 是 虚拟 主机 和 虚拟 目录 ? 虚拟 主机 有 几 种 方式 ? 

11. 在 一 台 Windows 服务 器 上 ,能 同时 安装 IIS 和 Apache/Tomcat 吗 ? 如 果 能 ,在 IIS 
下 创建 的 网 站 和 Tomcat 下 的 网 站 能 同时 运行 吗 ? 如 何 配置 ? 

12. 要 实现 对 Web 站 点 的 远程 管理 ,有 哪些 方式 ? 说 明 每 种 方式 的 特点 。 
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【本 章 导读 】 

在 Web 中 , 超 文本 标记 语言 (HTML) 或 可 扩展 标记 语言 是 W3C 发 布 的 用 于 进行 网 页 
书写 的 标准 和 规范 。 虽 然 都 称 为 标记 语言 ,但 两 者 的 功能 完全 不 同 ,HTML 规范 是 一 种 数 
据 展示 技术 , 它 定 义 了 一 组 固定 的 标记 ,来 规范 网 页 内 容 在 浏览 器 中 的 显示 形式 。XML 规 
范 则 是 一 种 数据 表达 技术 , 它 的 重点 是 解决 数据 的 逻辑 结构 和 语意 表达 ,以 实现 文档 的 结构 
化 和 数据 处 理 的 自动 化 。 目 前 ,XML 文档 数据 的 显示 通常 还 要 转换 为 HTML 格式 来 
显示 。 

本 章 将 从 广义 标记 语言 的 概念 出 发 ,介绍 标记 语言 的 概念 和 功能 ,对 HTML 规范 进行 
总 结 , 并 结合 Web 中 一 些 典 型 的 网 页 ,介绍 HTML 规范 中 的 主要 标记 的 功能 及 用 法 。 在 
XML 相关 技术 方面 ,重点 讲解 XML 元 语言 规范 文档 类 型 定义 和 XML Schema 技术 的 思 
想 和 出 发 点 ,同时 讲解 XML 扩展 样式 语言 ,以 及 简要 介绍 XML 路 径 语言 XPath ,使 大 家 对 
这 些 技 术 规 范 的 功能 及 相互 关系 有 一 个 比较 深入 的 了 解 ,为 Web 应 用 和 开发 打下 坚实 的 
基础 。 

【知识 要 点 】 

3.1 节 : 标记 语言 的 概念 ,标准 通用 标记 语言 (SGML)、 超 文本 标记 语言 (HTML)、 可 
扩展 标记 语言 (XML)。 

3.2 节 : 超 文本 标记 语言 (HTML) 文 档 结构 ,标记 ,标记 属性 ,段落 ,字体 标记 ,图 片 标 
记 , 超 链接 标记 ,表格 标记 ,表单 标记 ,输入 域 标记 ,CSS 技术 ,样式 表 ,CSS 选择 符 , 图 层 标 
记 , 区 段 标 记 , 帧 标记 ,浮动 帧 ,脚本 语言 标记 。 

3.3 节 : 可 扩展 标记 语言 (XML)、XML 文档 结构 .文档 声明 、 处 理 指令 XML 解析 器 。 

3.4 节 : 文档 类 型 定义 (DTD) 元 素 . 元 素 声 明基 本 元 素 、 复 杂 元 素 、 属 性 、 属 性 声明 、 
内 置 属性 类 型 、 实 体 、 实 体 定义 、 外 部 dtd 文件 。 

3.5 节 : XML Schema( 模 式 )、 命 名 空间 、 简 单数 据 类 型 .简单 数据 类 型 定义 、 复 杂 数 据 
类 型 、 复 杂 数 据 类 型 定义 \ 元 素 声 明 、 属 性 声明 、W3C CSD 内 置 数据 类 型 、 预 定义 元 素 、 模 式 
文件 。 

3.6 节 : XML 文档 对 象 模型 (DOM)、 可 扩展 样式 语言 (XSL)、 模 板 、XML 路 径 语 言 
XPath、 路 径 表 达 式 、 路 径 步 .谓词 .XPath 轴 、XPath 函数 。 

3.7 节 : XML Spy 集成 开发 环境 、dtd 文档 的 创建 ,模式 文档 的 创建 .XML 实例 文档 的 
创建 .系统 建 模 、 有 效 性 验证 。 
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3.1 标记 语言 及 其 发 展 


广义 上 的 标记 语言 可 以 理解 为 对 内 容 进行 描述 的 规范 或 标准 。 例 如 ,在 出 版 印刷 行业 ， 
编辑 人 员 在 进行 文档 内 容 编 辑 时 对 内 容 所 做 的 标记 ,通过 这 些 标记 符号 来 表达 对 内 容 的 修 
改 信息 。 在 Web 中 , 超 文本 标记 语言 则 通过 标记 来 定义 内 容 在 浏览 器 中 的 显示 样式 。 随 着 
语义 Web 的 发 展 以 及 异 构 环 境 下 的 数据 交换 需求 ,可 扩展 标记 语言 则 主要 用 于 对 数据 结构 
和 数据 内 容 进行 标记 ,成 为 重要 的 数据 表达 、 交 换 和 集成 标准 ,对 数据 的 显示 则 通过 其 他 相 
关 语言 来 完成 ,实现 了 数据 内 容 和 显示 的 分 离 。 

3.1.1 标准 通用 标记 语言 

标准 通用 标记 语言 (SGML) 是 一 个 用 来 定义 在 电子 表格 中 如 何 对 文件 的 结构 和 内 容 进 
行 描述 的 国际 标准 (ISO-8879)。 时 间 可 以 追溯 到 1969 年 ,当时 美国 IBM 公司 的 研究 人 员 
开始 设计 一 种 名 为 GML(Generalized Markup Language, 通 用 标记 语言 ) 的 语言 ,在 印刷 、 统 
计 等 需要 大 规模 数据 处 理 的 行业 和 部 门 的 支持 下 ,这 项 研究 工作 持续 了 十 几 年 ,于 1980 年 
推出 了 SGML ,并 于 1986 年 获得 国际 标准 化 组 织 (ISO) 的 批准 。 其 后 ,SGML 的 发 展 较为 
平稳 ,并 不 为 其 领域 之 外 的 人 们 所 广泛 了 解 。 直 至 1991 年 , 当 超 文本 标记 语言 (HTML) 问 
世 之 后 ,人 们 才 开 始 认识 SGML。 

为 了 满足 各 种 不 同 的 页 面 表达 需要 ,SGML 设计 得 非常 复杂 ,SGML 的 正式 规范 达 500 
多 页 ,因此 使 用 起 来 很 不 方便 ,使 得 它 未 能 得 到 普及 和 大 规模 的 应 用 。 虽 然 SGML 没有 被 
广泛 应 用 ,但 是 SGML 定义 了 标记 语言 的 基本 概念 ,奠定 了 标记 语言 发 展 的 技术 基础 。 

现在 ,在 Web 中 普遍 应 用 的 HTML 和 XML 都 是 在 SGML 的 基础 上 开发 成 功 的 ,可 以 
说 它们 都 是 SGML 的 一 个 子 集 。 作 为 互联 网 信息 共享 的 技术 规范 ,标记 语言 对 互联 网 的 发 
展 起 到 了 巨大 的 推动 作用 。 


3.1.2 超 文本 标记 语言 


超 文本 标记 语言 (HTML) 起 源 于 标准 通用 标记 语言 (SGML) ,由 世界 上 最 大 的 粒子 物 
理 研究 实验 室 欧洲 核子 研究 中 心 (CERN) 于 1991 年 首先 提出 ,是 推动 Web 迅速 发 展 的 原 
动力 ,被 誉 为 互联 网 发 展 历史 上 的 第 一 个 里 程 碑 。 

在 互联 网 发 展 的 早期 ,为 了 在 各 种 网 络 环境 之 间 、 不 同文 件 格式 之 间 进 行 交流 ,在 
SGML 基础 上 ,CERN 提出 了 超 文 本 标记 语言 (HTML) 的 概念 。HTML 是 一 种 用 来 制作 
超 文本 文档 的 简单 标记 语言 , 它 定 义 了 一 组 标记 符号 (tag) ,对 文件 的 内 容 进行 标注 ,指出 内 
容 的 输出 格式 ,如 字体 大 小 、 颜 色 .背景 颜色 .表格 形式 、 各 部 分 之 间 逻 辑 上 的 组 织 等 ,从 而 实 
现 了 文件 格式 的 标准 化 。 简 单 地 说 ,HTML 文件 包含 了 文档 数据 和 显示 样式 两 部 分 ,其 中 
文档 数据 是 显示 在 Web 浏览 器 中 的 数据 内 容 , 显 示 样 式 则 规定 了 这 些 内 容 在 浏览 器 中 以 何 
种 格式 、 样 子 呈 现 给 用 户 。 通 过 统一 使 用 支持 html 的 浏览 软件 ,用 户 可 以 在 任意 异 构 的 网 
络 环境 中 ,阅读 同一 个 文件 ,得 到 相同 的 显示 结果 ,并 可 以 对 文件 进行 跳跃 式 阅读 ,展现 了 很 
强 的 表现 力 。 
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HTML 主要 版 本 和 发 布 时 间 如 下 。 

(1) HTML 2.0, Internet 工程 任务 组 中 的 HTML 工作 组 开发 完成 了 HTML 2.0, 于 
1996 年 发 布 。 

(2) HTML 3.2,W3C 于 1997 年 1 月 14 日 将 其 列 为 推荐 版 本 ,在 HTML 2.0 标准 中 
添加 了 诸如 字体 .表格 ,Java 程序 浮动 、 上 标 、 下 标 等 特征 。 

(3) HTML 4.0,W3C 于 1997 年 12 月 18 日 将 其 列 为 推荐 版 本 ,第 二 个 稍 作 修 正 的 
HTML 4.0 版 本 于 1998 年 12 月 24 日 发 布 。HTML 4.0 中 最 重要 的 特征 是 引入 了 样式 表 
(CSS) 技 术 , 使 网 站 样式 与 内 容 分 离 ,使 得 网 站 结构 更 加 清晰 ,内 容 更 加 简洁 。 

(4) HTML 4.01,W3C 于 1999 年 12 月 24 日 将 其 列 为 推荐 版 本 ,是 HTML 4.0 的 升 
级 版 本 , 它 对 原版 本 做 出 了 部 分 修正 。 

(5) HTML 5.0, 作 为 下 一 代 超 文本 标记 语言 的 标准 ,草案 最 早 于 2004 年 提出 ,目前 仍 
处 于 开发 阶段 ,W3C 组 织 预测 ,其 完成 时 间 预 计 要 等 到 2012 年 以 后 或 更 长 的 时 间 。 

在 下 一 代 HTML 标准 HTML 5.0 的 发 展 过 程 中 ,W3C 组 织 硕 望 净化 XHTML 2. 0， 
回归 第 一 版 HTML 的 设计 理念 。 但 是 ,这 样 的 设计 理念 遭 到 了 W3C 之 外 的 一 些 重要 的 
HTML 专家 ,包括 浏览 器 厂商 ,Web 开发 人 员 、 作 者 和 其 他 有 关 人 员 的 质疑 ,2004 年 ,他 们 
成 立 了 一 个 独立 的 工作 组 , 即 WHATWG (Web 超 文本 应 用 程序 技术 工作 组 , Web 
Hypertext Application Technology Working Group) ,为 新 的 HTML 版 本 提出 了 新 的 设计 
方向 。 


3.1.3 可 扩展 HTML 


在 HTML 的 发 展 过 程 中 ,暴露 出 一 些 影响 其 发 展 的 缺陷 ,例如 : HTML 的 标记 固定 ， 
HTML 只 是 一 种 表现 技术 ,不 能 表达 语义 ; 不 能 适应 现在 越 来 越 多 的 网 络 设备 和 应 用 的 需 
要 ,比如 手机 、PDA .信息 家 电 都 不 能 直接 显示 HTML; 由 于 HTML 代码 不 规范 、 腔 肿 , 浏 
览 器 需要 足够 智能 和 庞大 才能 够 正确 显示 HTML; 数据 与 表现 混杂 ,页 面 要 改变 显示 ,就 
必须 重新 制作 HTML。 为 此 ,W3C 不 再 继续 开发 HTML。 

2000 年 底 , W3C 制定 了 可 扩展 HTML, 即 XHTML., 它 是 HTML 向 XML 过 渡 的 一 个 
桥 粱 。2000 年 1 月 20 日 发 布 XHTML 1.0,XHTML 1.0 是 HTML 4.01 基于 XML 的 形 
式 。2002 年 8 月 5 日 发布 XHTML 2.0 的 第 一 个 工作 草案 ,其 最 大 的 特点 就 是 取消 了 向 
后 兼容 性 ,去 除了 原先 版 本 中 的 一 些 标记 。 例 如 ,不 再 支持 使 用 很 少 的 二 em> (强调 ) 和 
到 strong 二 标记 等 ,这 就 使 得 原先 的 一 些 网 页 在 XHTML 2. 0 规范 的 浏览 器 中 不 能 正确 
显示 。 

需要 说 明 的 是 ,在 XHTML 的 研发 过 程 中 ,不 确定 的 东西 还 很 多 ,作为 HTML 向 XML 
的 一 种 过 渡 技 术 ,唯一 确定 的 就 是 它 要 更 好 地 表达 文档 中 的 语义 和 结构 ,将 文档 的 内 容 和 表 
现 技 术 能 够 更 好 地 分 离 , 更 好 地 实现 互联 网 中 的 数据 交换 和 展示 。 


3.1.4 可 扩展 标记 语言 


HTML 的 不 足 推动 了 XML 的 产生 和 发 展 ,其 核心 思想 是 实现 数据 和 显示 的 分 离 。 
1998 年 2 月 10 日 ,XML 工作 组 正式 向 W3C 提交 了 XML 的 最 终 推荐 标准 ,这 就 是 XML 
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1.0 标准 。XML 规范 定义 了 标记 语言 的 主要 特征 ,例如 DTD、XML Schema 等 基本 要 素 ， 
这 些 要 素 可 以 很 好 地 用 于 定义 数据 ,实现 异 构 环 境 下 的 数据 交换 。 

对 XML 文档 内 容 的 显示 、 查 询 及 操作 则 通过 其 他 一 系列 的 规范 来 实现 ,这 些 相关 的 规 
范 包括 可 扩展 样式 语言 (XSL) 、XML 路 径 语言 (XPath)、XML 查询 语言 (XQuery)、 可 扩展 
连接 语言 (XLL) 以 及 XML 文档 对 象 模型 (DOMD) 与 简单 应 用 程序 接口 (SAX) 等 ,通过 这 些 
规范 来 实现 对 XML 文档 的 显示 及 其 他 各 种 操作 。 


@.2 超 文 本 标记 语言 


超 文本 标记 语言 (HTML) 是 在 SGML 基础 上 发 展 起 来 的 ,是 互联 网 中 应 用 最 为 广泛 的 
标记 语言 ,被 称 为 World Wide Web 的 通用 出 版 语言 。 在 互联 网 中 , 绝 大 多 数 的 网 页 都 是 通过 
HTML 标记 语言 书写 的 ,所 有 的 Web 浏览 器 都 支持 HTML 规范 ,并 能 很 好 地 显示 HTML 网 
页 文件 。 即 使 是 XML 文档 ,也 通常 需要 通过 XSLT 转化 为 HTML 格式 进行 显示 。 


3.2.1 HTML 标记 语法 和 文档 结构 


HTML 文档 是 纯 文本 文件 ,由 “显示 内 容 * 和 “标记 ”两 部 分 组 成 。 标 记 描述 显示 内 容 以 
何 种 形式 在 浏览 器 中 显示 ,也 就 是 说 “标记 (Tag)” 是 对 内 容 的 标记 。 标 记 封 装 在 由 小 于 号 
(二) 和 大 于 号 (二 ) 构 成 的 一 对 尖 括 号 之 中 ,标记 一 般 分 首 标记 和 尾 标 记 , 它 们 成 对 出 现 。 首 
标记 用 于 开启 某 种 形式 的 显示 , 尾 标记 用 于 关闭 首 标记 开启 的 显示 功能 。 例 如 : 二 u 二 欢迎 
光临 二 /二 , 首 标 记 二 u 二 开启 下 划 线 功能 , 尾 标 记 二 /uu 二 关闭 下 划 线 功能 。 该 语句 在 浏览 
器 中 将 把 文本 串 “ 欢 迎 光 临 * 加 上 下 划 线 显示 。 


1. 标记 类 型 

标记 分 为 “ 单 标记 ”和 *“ 双 标记 ”两 种 类 型 。“ 单 标记 ”是 指 只 需 单 独 使 用 就 能 完整 地 表达 
意思 的 一 类 标记 , 单 标记 不 标记 任何 内 容 。 这 类 标记 的 语法 是 : 

< 标记 > 

常用 的 单 标 记 有 换行 标记 二 br 二 、 水 平 线 标记 二 hr 二 等 。 

另 一 类 标记 称 为 “ 双 标 记 ”, 由 “ 首 标记 ”和 *“ 尾 标记 ”两 部 分 构成 ,必须 成 对 使 用 。 首 标记 
告诉 Web 浏览 器 从 此 处 开始 执行 该 标记 所 表示 的 功能 ,而 尾 标记 告诉 Web 浏览 器 在 这 里 
结束 该 功能 。 首 标记 名 称 前 加 一 个 斜 杠 (/) 即 成 为 尾 标 记 。 这 类 标记 的 语法 是 : 

< 标记 > 标记 内 容 </ 标 记 > 

其 中 “标记 内 容 ” 部 分 就 是 要 被 这 对 标记 施加 作用 的 部 分 。 例 如 ,如 果 需 要 标记 一 段 文 
本 要 红色 显示 , 则 将 文本 放 在 双 标 记 二 font color 王 "并 FF0000" 二 … 一 /font 二 中 即 可 , 即 ; 


<font color = " 井 FF0000"> 您 好 </font> 


标记 可 以 被 Web 浏览 器 解释 ,对 所 标记 的 内 容 以 特定 的 样式 在 浏览 器 中 显示 。 对 于 其 
他 的 文本 阅读 器 ,例如 记事 本 等 , 则 不 能 解析 标记 的 含义 。 
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2. 标记 属性 

在 HTML 规范 中 ,标记 都 设 定 了 默认 的 显示 样式 ,此 外 ,标记 通常 还 有 相应 的 属性 。 
标记 属性 分 为 一 般 属 性 和 事件 属性 两 种 类 型 ,一 般 属性 对 应 一 个 相应 的 属性 值 ,事件 属性 则 
对 应 一 段 程序 代码 , 当 标记 上 的 对 应 事件 发 生 时 ,激活 相应 的 事件 对 应 的 程序 。 

设置 属性 标记 的 一 般 形式 是 : 

< 标记 属性 = "属性 值 | 程序 " 属性 = "属性 值 | 程序 "”…> 


各 属性 之 间 无 先后 次 序 ,属性 之 间 用 空格 分 开 。 属 性 也 可 省 略 ( 即 取 默 认 值 ), 属 性 值 两 
侧 为 西 文 双 引 号 ("), 可 以 使 用 西 文 单 引号 (') ,或 省 略 不 写 。 

例如 : 单 标记 二 hr 二 表示 在 文档 当前 位 置 画 一 条 水 平 线 , 默 认 情 况 下 是 从 窗口 中 当前 
行 的 最 左 端 一 直 夯 到 最 右 端 。 另 外 ,二 hr 二 标记 还 有 size、align、width 等 属性 ,其 中 size 属 
性 定义 线 的 粗细 ,默认 为 1; width 属性 定义 线 的 长 度 ,可 取 相对 值 (整个 窗口 的 百分比 ), 也 
可 取 绝 对 值 (屏幕 像素 点 的 个 数 ) ,默认 值 是 100% 。align 属性 设置 对 齐 方式 ,可 取 left( 左 
对 齐 ,默认 值 ) ,center( 居 中 ) 和 right( 右 对 齐 ) ,要 画 一 条 300 像素 宽 、 居 中 显示 的 水 平 线 , 可 
写作 二 hr width 王 "300" align 一 "center" 二 。 

再 如 ,在 图 片 标 记 二 img 二 中 可 设置 事件 属性 , 写 为 一 img src 一 "images/logo. jpg" 
onclick 王 "window. alertC'hi) "过 ,其 中 onclick 就 是 事件 属性 , 当 在 图 片上 单 击 时 ,事件 被 
激活 ,打开 一 提示 窗口 。 

3. 文档 结构 


一 个 HTML 文档 以 二 html 过 标记 开始 ,以 二 /html 过 标记 结束 ,表示 这 对 标记 间 的 内 
容 是 HTML 文档 。HTML 文档 分 成 文件 头 和 文件 体 两 个 部 分 ,由 相应 的 标记 来 区 分 。 
HTML 文档 总 体 结构 如 下 : 

<html > 

<head> 

头 部 信息 
</head> 

<body> 

文档 主体 
(语句 部 分 ) 

</body> 

</html > 

其 中 ,一 head 盖 … 二 /head> 之 间 是 文件 头 , 由 一 系列 子 标记 构成 ,如 定义 文档 标题 的 
<title 之 标记 等 , 若 不 需 头 部 信息 则 可 省 略 此 标记 。 毛 body 之 …< 一 /body> 之 间 是 文件 体 ， 
表示 正文 内 容 的 开始 ,二 body 二 标记 一 般 不 能 省 略 。 


3.2.2 文件 头 标 记 及 子 标记 


在 HTML 文档 中 ,二 head 宝 … 二 /head 记 标记 对 之 间 的 部 分 称 为 文件 头 。 根 据 Web 的 
工作 原理 ,在 Web 服务 器 和 Web 浏览 器 的 HTTP 通信 中 ,HTTP 头 为 浏览 器 和 服务 器 提 
供 辅 助 信息 ,这些 辅助 信息 也 可 以 写 在 HTML 文档 的 头 部 ,为 浏览 器 、 搜 索引 擎 等 提供 信 
息 。 例 如 : 设置 网 页 内 容 字符 编码 .网 页 关键 字 等 ,这 可 以 使 浏览 器 按照 设 定 的 字符 编码 正 
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确 地 显示 网 页 内 容 , 以 及 让 搜索 引擎 记录 网 页 关键 字 。 
文件 头 中 主要 的 标记 有 < 一 title 字 .二 meta 二 一 script 二 等 ,下 面 分 别 介绍 。 
1. 二 title 二 二 /title 二 标记 


<title> 一 /title 之 标记 出 现在 二 head 之 … 志 /head 二 标记 对 内 ,用 于 标识 网 页 主题 ,其 
中 的 内 容 将 在 浏览 器 的 标题 栏 中 显示 ,不 出 现在 页 面 内 。 


2. 二 meta 二 标记 


meta 即 “ 元 ”的 意思 ,meta data 即 元 数据 ,是 关于 数据 的 数据 。 元 标记 二 meta 一 是 最 重 
要 的 辅助 性 标记 ,往往 不 引起 用 户 的 注意 ,但 是 它 对 于 网 页 是 否 能 够 被 搜索 引擎 检索 .提高 
网 页 在 搜索 列表 的 排序 起 着 关键 的 作用 ,是 一 个 非常 有 价值 的 标记 。 

二 meta 二 标记 为 单 标记 ,没有 尾 标 记 。 一 meta 一 标记 共有 两 个 属性 ,分 别 是 http-equiv 属 
性 和 name 属性 ,不 同 的 属性 又 有 不 同 的 参数 值 , 这 些 不 同 的 参数 值 实现 了 不 同 的 网 页 功能 。 

1) http-equiv 属性 

http-equiv 相当 于 HTTP 头 ,向 浏览 器 传 回 一 些 有 用 的 信息 ,以 帮助 正确 显示 网 页 内 
容 , 与 之 对 应 的 属性 值 为 content, content 中 的 内 容 其 实 就 是 各 个 参数 的 变量 值 。meat 标 
记 的 http-equiv 属性 语法 格式 是 : 


<meta http- equiv = "参数 " content = "参数 变量 值 "> 


其 中 http-equiv 属性 主要 有 以 下 几 种 参数 。 

(1) content-type, 设 定 页 面 文档 类 型 及 使 用 的 字符 集 。 

例如 : 二 meta http-equiv 二 "content-type” content 二 "text/html; charset 一 GB 2312" 过 ,该 
元 标记 告知 浏览 器 ,文档 为 HTML 文档 ,使 用 的 字符 集 为 GB 2312。 如 果 是 XML 文档 ,可 
以 设置 content 属性 值 为 content 二 "text/xml; charset 二 GB 2312"。 

(2) expires, 用 于 设 定 网 页 的 到 期 时 间 。 一 旦 网 页 过 期 ,必须 到 服务 器 上 重新 下 载 。 

例如 : 


<meta http - equiv = "expires" content = "Thur, 8 May 2008 18:18:18 GMT"> 


(3) pragma, 禁 止 浏 览 器 从 本 地 计算 机 的 缓存 中 访问 页 面 内 容 。 
例如 : 


<meta http - equiv = "pragma" content = "no-cache"> 


该 种 设 定 访问 者 将 无 法 使 用 脱 机 浏览 功能 。 
(4) refresh ,自动 刷新 并 指向 新 页 面 。 
例如 : 
<neta http— equiv = "refresh" content = "60; url = new. htn"> 


则 浏览 器 将 在 60 秒 后 ,自动 转 到 new. htm。 利 用 该 功能 ,可 以 显示 一 个 封面 提示 页 面 ,在 
若干 时 间 后 ,再 自动 转移 到 其 他 页 面 。 
如 果 不 设置 URL 项 ,浏览 器 则 刷新 本 页 ,这 就 实现 了 Web 聊天 室 定期 刷新 的 特性 。 


85 


MA 


86 。 Web 技术 导论 (第 3 版 ) 


NM 


(5) windowrtarget, 强 制 页 面 在 当前 窗口 以 独立 页 面 显示 。 
例如 : 
<meta http— equiv = "window- target" content = "_top">, 
可 以 用 来 防止 别人 在 框架 中 调用 自己 的 页 面 。 
2) name 属性 
name 属性 主要 用 于 描述 网 页 ,与 之 对 应 的 属性 值 为 content,content 中 的 内 容 主要 是 
便于 搜索 引擎 查找 信息 和 分 类 信息 用 的 。meat 标记 的 name 属性 语法 格式 是 : 
<meta name = "参数 " content = "具体 的 参数 值 "> 
其 中 name 属性 主要 有 以 下 几 种 参数 值 。 
(1) keywords, 设 置 网 页 的 关键 字 , 用 来 告诉 搜索 引擎 该 网 页 的 关键 字 是 什么 。 
例如 : 


< meta name = "keywords" content = "E-learning, ontology"> 


(2) description ,description 用 来 告诉 搜索 引擎 网 站 的 主要 内 容 。 
例如 : 


<meta name = "description" content = "This page is about E-learning etc."> 


(3) author, 标 注 网 页 的 作者 。 
例如 : 


<meta name = "author" content = "brion@mail.abc. com"> 


(4) robots, 告 诉 搜索 机 器 人 需要 索引 的 页 面 有 哪些 。content 的 参数 有 all、 none、 
index、noindex,follow 、nofollow ,默认 值 为 all。 


3. 二 link 二 标记 


三 link 二 标记 定义 了 文档 之 间 的 包含 。 在 HTML 的 头 部 可 以 包含 任意 数量 的 二 link 二 
标记 ,二 link 二 标记 带 有 很 多 属性 ,下 面 是 一 些 常 用 的 属性 。 

(1) type, 用 于 指定 被 包含 的 文件 类 型 。 例 如 ,text/css 是 指 包含 一 个 层 赫 样式 表 文件 。 

(2) rel, 定 义 HTML 文档 和 所 要 包含 资源 之 间 的 链接 关系 ,可 能 的 取 值 很 多 ,最 为 常 
用 的 取 值 是 stylesheet, 用 于 包含 一 个 固定 首选 样式 表单 。 

(3) href ,指向 被 包含 资源 的 URL 地 址 。 

例如 ,如 果 文 档 包 含 一 个 外 部 的 css 文件 ,在 文档 头 部 应 该 定义 如 下 : 


< link type = "text/css" rel = " stylesheet”href = "mystyle. css"> 
4. 二 base 二 标记 


二 base 二 标记 定义 了 文档 的 基础 URL 地 址 ,在 文档 中 所 有 的 相对 地 址 形式 的 URL 都 
是 相对 于 这 里 定义 的 URL 而 言 的 。 一 篇 文档 中 的 二 base 二 标记 不 能 多 于 一 个 ,必须 放 于 头 
部 ,并 且 应 该 在 任何 包含 URL 地 址 的 语句 之 前 。 
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过 base 标记 包含 如 下 属性 。 

1) href 属性 

href 属性 , 必 选 属性 ,指定 了 文档 的 基础 URL 地 址 。 例 如 ,如 果 和 希望 将 文档 的 基础 
URL 定义 为 http://www. abc. com, 则 可 以 使 用 如 下 语句 : 


<base href = "http://www.abc.com"> 


当 定 义 了 基础 URL 地 址 之 后 ,文档 中 所 有 引用 的 URL 地 址 都 从 该 基础 URL 地 址 开 
始 , 例 如 ,对 于 上 面 的 语 名 ,如果 文档 中 一 个 超级 链接 指向 gsl/welcome. htm, 则 它 实际 上 指 
向 的 是 如 下 URL 地 址 : http://www. abc. com/gsl/welcome. htm。 

2) target 属性 

target 属性 同 框架 一 起 使 用 , 它 定 义 了 当 文 档 中 的 链接 被 单 击 后 ,在 哪 一 个 框架 中 打开 
页 面 。 如 果 文 档 中 超级 链接 没有 明确 指定 打开 页 面 的 目标 框架 , 则 使 用 这 里 定义 的 地 址 代 
替 。 常 用 的 target 的 属性 值 有 : 

(1) _blank, 表 明 在 新 窗口 中 打开 链接 指向 的 页 面 。 

(2) _self, 在 当前 文档 的 框架 中 打开 页 面 。 

(3) _parent, 在 当前 文档 的 父 窗口 中 打开 页 面 。 

(4) _top, 在 链接 所 在 的 完整 窗口 中 打开 页 面 。 

例如 : 二 base target 王 " blank" 二 表明 页 面 上 所 有 的 链接 都 在 新 窗口 打开 。 


5. 缘 景 音乐 标记 二 bgsound 二 

在 文档 头 内 ,还 可 以 定义 背景 音乐 ,标记 为 二 bgsound 记 ,用 以 插入 背景 音乐 ,可 插入 的 
音频 文件 类 型 有 Wave 文件 (* . wav) ,Midi 序列 文件 (x . midi)、Real Audio 文件 ( x. ram、 
x* . ra) .AIFF 声音 文件 ( x .aif、 x .aifc、x* .aiff) .AU 声音 文件 (x .au、* .snd) 。 

二 bgsound 记 标记 为 单 标 记 , 一 般 形式 是 : 

<bgsound src=" " autostart ="" loop=""> 


标记 的 属性 有 : 

(1) src 属 性 ,给 出 音乐 文件 的 url 值 。 

(2) autostart 属性 ,设置 音乐 文件 播送 结束 后 的 处 理 , 如 果 为 true, 则 自动 播放 音乐 ,为 
false 则 结束 不 播放 ,默认 值 为 false。 

(3) loop 属性 ,设置 是 否 自动 反复 播放 ,loop 王 2 表示 重复 两 次 ,infinite 表示 重复 多 次 。 


3.2.3 文档 体 标记 及 其 属性 


在 二 body 二 … 所 /body> 标 记 对 之 间 的 部 分 称 为 html 文档 的 文档 体 。 文 档 体 中 描述 
的 是 浏览 器 窗口 中 显示 的 内 容 。 无 论 网 页 多 复杂 ,它们 都 是 由 文本 、 图 片 超 链接 等 内 容 构 
成 的 ,这 些 页 面 内 容 都 由 相应 的 HTML 标记 来 标记 ,它们 都 是 二 body 二 标记 的 子 标记 。 

在 讲解 具体 文档 内 容 标记 以 前 , 先 介绍 文档 体 标 记 所 body 之 。 所 body> 标 记 是 一 个 非常 
重要 的 标记 ,含有 大 量 的 属性 ,许多 重要 的 网 页 功能 都 是 通过 二 body 二 标记 的 属性 实现 的 。 


1. 一 般 属性 
到 body 之 标记 的 一 般 属 性 用 于 页 面 的 一 般 性 设置 . 见 表 3-1。 
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表 3-1 一 body 二 标记 一 般 属性 


属 性 用 途 举 例 
bgcolor="#rrggbb" 设置 页 面 背景 颜色 二 body bgcolor= "red" 二 ,红色 背景 
background 设置 页 面 背 景 图 片 background 一 "images/bg1. jpg" 
bgproperties 设置 成 fixed, 则 背景 图 案 不 滚动 bgproperties 一 fixed 
topmargin leftmargin、 设置 页 面 内 容 的 上 .下 \ 左 ,右边 ”一 body leftmargin 王 "0”topmargin 一 
bottommarigin rightmargin ” 距 , 像 素 值 "20"> 
text="#rrggbb" 设置 文本 颜色 去 body text 一 " 井 f{i0000" 之 ,红色 文本 
[村 ee 文本 链接 颜 body link 一 vblue> ,链接 为 蓝 色 
vlink="#rrggbb" 设置 阅读 过 的 超 文本 链接 颜色 ， 二 body vlink 二 "#ff0000" 二 ,红色 

默认 值 是 紫色 
alink="#rrggbb" 设置 动作 中 的 超 文本 链接 颜色 ， 一 body alink 二 "yellow", 设 为 黄色 
默认 值 是 紫色 


颜色 的 设置 可 以 通过 HTML 所 给 定 的 颜色 常量 名 ,或 者 RGB( 红 、 绿 、 蓝 三 色 的 组 合 ) 
设置 ,例如 "# ffo000" 表 示 红 色 。 各 个 属性 可 以 结合 使 用 ,如 : 二 body bgcolor 王 "red" text 一 
" 井 0000ff" 二 ,设置 网 页 的 背景 色 为 红色 (red) ,文本 为 蓝 色 (" 井 0000ff") 。 

2. 事件 属性 


当 一 个 Web 文档 被 加 载 显示 或 者 退出 (关闭 ) , 当 进行 移动 窗口 或 改变 文档 窗口 大 小 等 
操作 时 ,会 发 生 相 应 的 事件 ,这 些 事件 在 二 body 过 标记 中 通过 事件 属性 来 表达 。 二 body 二 
标记 常见 的 事件 属性 见 表 3-2 。 


表 3-2 ”二 body> 标 记 中 的 事件 属性 


事 件 触发 条 件 事 件 触发 条 件 
onLoad 页 面 下 载 完成 时 触发 onDblClick 鼠标 双击 时 触发 
onUnload 退出 页 面 时 触发 onMouseDown ”鼠标 按键 被 按 下 时 触发 
onFocus 页 面 窗口 获得 焦点 时 触发 onKeyDown 键 被 按 下 时 触发 ,按键 的 ASCII 码 值 
onBlur 页 面 窗口 失去 焦点 时 触发 保存 在 window. event. keyCode 中 
onResize 窗口 改变 大 小 时 触发 onKeyPress 键 被 按 下 然后 被 释放 时 触发 
onScroll 单 击 滚动 条 时 触发 onKeyUp 键 被 释放 时 触发 
onMouseMove 鼠标 移动 时 触发 


在 上 述 事 件 中 ,有 些 事 件 是 二 body 二 标记 特有 的 ,有 些 事件 可 能 存在 于 多 个 不 同 的 标记 中 。 

事件 属性 的 值 往往 是 一 个 JavaScript 函数 ,来 完成 Web 编程 任务 。 在 FrontPage、 
Dreamweaver 等 工具 软件 中 ,可 以 通过 行为 面板 (在 FrontPage 2003 中 ,对 应 “格式 ”一 “ 行 
为 ”菜单 命令 ) ,可 以 显示 一 个 标记 支持 的 行为 事件 ,并 且 可 自动 生成 简单 的 行为 JavaScript 
代码 ,从 而 减少 用 户 书写 程序 的 工作 量 , 具 体 应 用 参考 后 面 的 章节 。 

【 例 3-1】 HTML 标记 的 概念 及 认 知 。 

HTML 标记 就 是 标记 内 容 在 Web 浏览 器 中 以 特定 的 格式 显示 ,而 在 非 HTML 应 用 程 
序 中 , 则 不 能 按照 标记 进行 显示 。 
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在 Windows 中 ,用 “记事 本 ”程序 输入 如 图 3-1 所 示 的 HTML 标记 。 
将 上 述 内 容 保存 为 网 页 文档 exa3-1. htm, 然 后 双击 该 文档 ,文档 将 在 浏览 器 中 打开 , 显 
示 结 果 如 图 3-2 所 示 。 


exa3-1.htn 


记事 本 


文件 外 编辑 下 ) 格式 @) 查看 如 ) 帮助 如 


《font color="#FF9999"> 你 好 《</font>| 


图 3-1 


用 “记事 本 ”程序 创建 HTML 文档 


汉 E:\ 款 材 -一 Web 技 术 导 论 (第 3 版 )\exa3-1.hta - 下 .此 | 器 | 辆 | 
文件 旭 ” 编 强 四 查看 WW) 收 疗 人 工具 加 天 助人 0 [2 


加 - 国 国 从 | 用 失 来 冶 收 天 全 | 各" 总 
税 ] E: 教材 --Yeh 技 术 导论 各 3 版 )\ecs-L ht 国 | 贺 车 到 甸 谤 


图 3-2 HTML 文档 在 浏览 器 中 显示 界面 


可 以 看 到 ,在 浏览 器 窗口 显示 红色 的 “您 好 ”, 对 比 在 “记事 本 ”中 的 显示 ,可 见 标记 就 是 
告知 浏览 器 ,被 标记 的 内 容 要 以 什么 方式 来 显示 。 


3.2.4 


文本 标记 


在 一 个 网 页 中 ,文本 内 容 通常 是 网 页 的 主要 内 容 , 在 HTML 规范 中 ,对 文本 内 容 的 标 
记 较 多 ,它们 标记 了 文本 内 容 在 浏览 器 中 的 默认 显示 样式 ,要 修改 标记 的 默认 显示 ,可 以 通 
过 设置 标记 属性 来 完成 。HTML 中 有 关 文 本 的 标记 及 属性 见 表 3-3。 
表 3-3 文本 标记 及 常用 属性 


分 类 标 记 一 般 属性 事件 属性 
<hl></hl>*…<hé></hé>, |. onclick 、 
标题 标记 。 | 一 级 到 六 级 标题 标记 ,对 应 的 字 | ess 本。 | ondbleleikwonmouseover 
体 逐 渐渐 小 onmouseout 
id style、class onclick .ondblclcik 
< 王 font 盖 … 一 /font> ,字体 标记 “| face、size,color, 设 置 字 | onmouseover 
文本 格式 体 、 文 字 大 小 和 颜色 onmouseout 
标记 二 b>… 二 /b 二 , 粗 体 标记 id style class 同上 
二 这 …<</i> ,斜体 标记 同上 同上 
< 王 u>…<</u> ,下 划 线 标记 同上 同上 
回 车 换 行 | <br 二 ,将 输出 位 置 转 到 下 一 行 es 无 
标记 的 开始 ee 
二 p>… 二 /p 记 ,段落 标记 ,标记 | id、style、class onclick .ondblclcik 
段落 标记 一 个 段落 ,输出 位 置 转 到 下 一 行 | align onmouseover 
开始 ,并 增加 一 个 空 行 title onmouseout 
id style、class 
一 marquee 之 … 一 /marquee 过，| height、width, 设 定 滚 
走马 灯 标记 “| 用 于 标记 一 行 或 多 行 滚动 的 | 动 字幕 的 高 度 和 宽度 | 同上 


文本 


bgcolor direction 
scrollamount、scrolldlay 
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分 类 标 记 一 般 属性 事件 属性 


水 平 线 标记 。 | <hr> ,插入 一 条 水 平 线 ee 无 


size、color width 


三 二 扩大 性 文学 = 一 之 ;用 
于 在 HTML 文档 中 书写 说 明 性 
文字 ,注释 文字 可 以 多 行 ,内 容 
在 浏览 器 中 不 显示 


注释 标记 


从 表 3-3 可 以 看 出 ,虽然 不 同 标 记 的 属性 不 完全 相同 ,但 有 些 属性 是 大 多 数 标记 所 共有 
的 ,这 包括 : Did 属性 ,唯一 地 标识 一 个 标记 ; @name 属性 ,为 标记 命名 ,这 在 DOM 模型 中 
对 应 了 标记 所 对 应 的 内 存 对 象 ,类 似 于 内 存 变 量 名 , 以 便于 客户 端 脚 本 程序 的 访问 ; 
@style 属性 ,设置 标记 的 内 联 样 式 , 用 于 修改 标记 的 默认 显示 ; @class 属性 ,设置 标记 的 样 
式 类 ,这 是 通过 CSS 定义 的 。 

上 述 标 记 可 以 联合 使 用 ,例如 : 


<b>< font face = "宋体 ”size = "3" color = "#0000FF">< i><u> 字 体 标记 一 </u></i></font > 
</b> 


显示 效果 为 : 
安 妊 厅 训 一 

【 例 3-2】 编写 一 段 跑马 灯 效 果 的 代码 。 

示例 代码 如 下 : 

<marquee onmouseover = this. stop() onmouseout = this. start() scrollAmount = 1 scrollDelay = 60 

direction = up width= 150 height = 200> 

活动 字幕 内 容 第 一 行 < br > 

活动 字幕 内 容 第 二 行 <br > 

活动 字幕 内 容 第 三 行 < br > 

</marquee> 

上 述 代 码 ,将 在 一 个 区 域内 ,垂直 地 滚动 多 行 ,鼠标 指 针 指 向 时 停止 滚动 ,离开 时 继续 
滚动 。 

以 下 是 几 点 说 明 。 

(1) 二 marquee 标 记 常 用 的 属性 如 下 。 

OO align 属性 , 设 定 活动 字幕 的 位 置 , 取 值 可 以 是 left、center、right、top 或 bottom。 

@ bgcolor 属性 , 设 定 活 动 字幕 的 背景 颜色 ,一 般 是 十 六 进 制 数 。 

@ direction 属性 , 设 定 活动 字幕 的 滚动 方向 , 取 值 可 以 是 left、right、up 或 down。 

@ behavior 属性 , 设 定 滚动 的 方式 ,主要 有 三 种 方式 : behavior 一 "scroll "表示 由 一 端 滚 
动 到 另 一 端 ; behavior 王 "slide" 表 示 由 一 端 快速 滑动 到 另 一 端 , 且 不 再 重复 ;behavior 一 
"alternate" 表 示 在 两 端 之 间 来 回 滚动 。 

@ height 和 width 属性 , 设 定 滚动 字幕 的 高 度 和 宽度 。 

hspace 和 vspace 属性 , 设 定 滚动 字幕 的 左右 边框 和 上 下 边框 的 宽度 。 
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@ scrollamount 属性 , 设 定 活 动 字幕 的 滚动 距离 。 

@ scrolldelay 属性 ,用 于 设 定 滚 动 两 次 之 间 的 延迟 时 间 。 

加 loop 属性 ,用 于 设 定 滚动 的 次 数 , 当 loop 王 -1 表示 一 直 滚动 下 去 ,直到 页 面 更 新 。 

默认 情况 下 , 王 marquee 之 标记 是 向 左 滚动 无 限 次 ,字幕 高 度 是 文本 高 度 , 水 平 滚动 的 
宽度 是 当前 位 置 的 宽度 ; 垂直 滚动 的 高 度 是 当前 位 置 的 高 度 。 

(2) 由 于 二 mqrquee> 标 记 只 能 作用 于 一 段 (二 p… 二 /p) 文 本 ,因此 活动 字幕 为 多 
行 时 ,分 行 时 只 能 用 二 br 二 标记 ,不 能 用 二 p 二 标记 。 

(3) 字幕 中 也 可 以 加 入 图 像 ,代码 如 下 : 


<marquee >< img src = "image/logo. gif" width= "20" height = "20"> 欢 迎 光临 </marquee > 


如 果 和 希望 深 动 的 内 容 带 有 超 链接 ,可 以 将 内 容 用 二 a 二 … 一 /a 二 标记 , 即 二 margqee 二 
二 a href 王 "0" 盖 活动 字幕 内 容 二 /a 字 一 /marqee 二 。 

(4) 如 果 是 使 用 FrontPage 编辑 html 文档 ,对 于 多 行 和 插入 图 片 的 一 marquee 二 ， 
FrontPage 会 自动 地 处 理 成 一 行 或 把 二 img 之 标记 放 到 二 marquee 二 … 二 /marquee 二 标记 的 
外 面 ,此 时 需要 通过 “记事 本 ”程序 手工 处 理 , 将 多 行 或 图 片 放 回 到 二 marquee 二 … 
二 /marquee 二 标记 内 部 ,实现 多 行 或 者 带 有 图 片 的 滚动 。 


3.2.5 图 像 标记 及 影像 地 图 


在 一 个 网 页 中 ,图 片 是 和 文本 一 样 最 常见 的 网 页 内 容 之 一 。 在 HTML 中 ,图 片 用 两 种 
形式 出 现 , 一 种 是 简单 的 图 片 , 另 一 种 是 影像 地 图 。 


1. 图 像 标记 二 img 过 


在 网 页 中 插入 一 幅 图 片 ,图 片 由 过 img 之 标记 , 它 是 一 个 单 标记 。 在 网 页 中 标记 一 个 图 
片 的 一 般 形式 是 : 


< img src= "图 片 的 url"> 


在 二 img 二 标记 中 ,必须 指定 src 属性 , 它 的 取 值 为 图 片 的 路 径 和 文件 名 ,为 必 选 属性 。 
二 img 盖 标记 并 不 是 真正 地 把 图 像 嵌 入 到 HTML 文档 中 ,而 是 将 标记 的 src 属性 赋值 为 图 
形 文件 所 在 的 路 径 及 文件 名 (浏览 器 显示 的 图 像 格式 为 gif\jpg 或 png)。 这 也 是 在 Web 服 
务 器 配置 中 为 什么 要 选择 保持 HTTP 连接 (图 2-14) ,同时 也 是 Web 浏览 器 在 保存 页 面 时 
有 多 种 文件 保存 类 型 的 原因 。 下 面 是 二 img 记 标记 的 部 分 常用 属性 及 其 说 明 。 

(1) src: 设 定 图 片 文件 的 存放 路 径 ,应 采用 和 当前 页 面 的 相对 路 径 形式 。 图 片 文件 须 
保存 在 站 点 主 目录 下 的 某 个 文件 夹 中 。 

(2) id: 指定 的 图 片 id 号 ,用 于 对 图 像 的 对 象 的 程序 访问 。 

(3) name: 用 于 设 定 图 像 的 名 称 , 用 于 对 图 像 对 象 的 程序 访问 。 

(4) height 和 width: 分 别 用 于 设置 图 像 的 高 度 和 宽度 ,可 以 与 图 片 实际 的 宽度 和 高 度 
不 同 ,此 时 浏览 器 对 图 片 进行 缩放 显示 ,可 能 引起 图 片 变形 。 

(5) border: 设置 图 片 边框 。 

(6) class: 设置 二 img 二 的 用 户 自 定义 样式 类 。 
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(7) title: 设置 图 像 标题 , 当 鼠 标 指针 移 到 图 片上 时 ,在 指针 的 右 下 角 显 示 title 的 内 容 。 

(8) alt: 设置 图 像 蔡 代 文字 ,主要 用 于 在 浏览 器 还 没有 装 入 图 像 ( 或 关闭 图 像 显 示 ) 时 ， 
显示 此 图 片 的 蔡 代 文字 。 一 个 网 页 除了 网 页 文件 外 ,其 他 所 包含 的 图 片 都 是 单独 的 文件 , 浏 
览 器 下 载 一 个 网 页 时 ,除了 下 载 网 页 文件 ,默认 情况 下 ,会 一 并 下 载 网 页 中 包含 的 其 他 文件 ， 
例如 过 img 之 中 src 标记 的 文件 。 

(9) align: 设置 图 像 的 对 齐 方式 。 除 了 常规 的 left、right、center 外 ,还 有 absmiddle 等 
取 值 , 它 将 影响 图 片 和 文字 混合 时 的 对 齐 方式 ,例如 在 一 个 单元 格 内 ( 王 td 之 ) ,让 图 片 和 文 
字 垂 直 居 中 。 

除了 上 述 的 一 般 属性 外 ,二 img 二 标记 还 有 大 量 的 鼠标 和 键盘 事件 属性 ,例如 onload、 
onclick .ondbclick .onmouseover ,onkeydown、onkeypress 等 ,在 FrontPage 等 工具 中 , 单 击 
插入 的 图 片 , 在 行为 面板 中 ,可 以 查看 图 片 所 有 的 事件 属性 。 

【 例 3-3】 在 一 个 网 页 中 ,插入 一 副 图 片 1.jpg, 当 鼠标 指针 移 到 图 片上 的 时 候 , 显 示 另 
一 幅 图 片 2. jpg, 鼠 标 指针 移 走 后 重新 显示 图 片 1. jpg。 

分 析 : 根据 题目 要 求 , 可 以 用 所 img 二 标记 图 片 1. jpg, 然 后 设置 二 img 之 标记 的 
onmouseover 属性 和 onmouseout 属性 ,来 实现 图 片 的 切换 。 设 网 页 文件 名 为 myimg. htm， 
和 两 个 图 片 在 同一 文件 夹 下 。 示 例 代码 如 下 : 

<html> 

<head> 

<meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"> 

</head> 

<body> 

<img src="1.jpg" width = "200" height = "150" name = "tai" 

alt = "泰山 图 片 " vspace = "10" hspace= "10" 
‘onmouseover = "tai. src = '2. jpg'" onmouseout = "tai. src = '1.jpg'" > 

</body> 

</html > 

在 onmouseover 和 onmouseout 事件 属性 中 ,我 们 为 当前 的 二 img 二 标记 对 应 的 内 存 对 
象 的 src 属性 赋值 ,从 而 改变 当前 显示 的 图 片 。 


2. 影像 地 图 标记 一 map 二 二 /map 二 


所 谓 “ 影 像 地 图 ”, 就 是 在 一 个 图 片上 定义 一 系列 区 域 ,每 个 区 域 对 应 一 个 超 链接 。 设 置 
影像 地 图 ,首先 要 通过 所 img> 标 记 标记 一 幅 图 片 ,并 设置 二 img> 的 ismap 属性 ; 然后 再 定 
义 相应 的 热点 区 域 。 使 用 影像 地 图 的 一 般 形 式 是 : 

< img src= "图 片 url" usemap="#mapname"” ismap> 

<map name = "mapname"> 


<area href = "url”shape = "circle" coords = "坐标 值 " > 
<area href = "url" shape = "rect" coords = "坐标 值 "> 


</map > 
其 中 ,过 map 之 … 王 /map 过 为 影像 地 图 标记 ,包含 一 系列 area 子 标记 ,该 标记 可 以 在 图 
像 地 图 中 设 定 作用 区 域 ( 又 称 * 热 点 ”) ,每 个 热点 区 域 通常 对 应 一 个 超 链接 。 热 点 的 坐标 值 
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由 图 片 决定 ,通常 需要 利用 FrontPage 等 工具 来 完成 热点 的 定义 。 
3.2.6 超 链接 与 书签 


超 链 接 是 HTML 页 面 的 重要 功能 , 超 链 接 可 以 分 为 外 部 超 链 接 和 内 部 超 链接 两 种 ,外 
部 超 链 接 是 一 个 页 面 到 另 一 个 页 面 的 链接 ,内 部 超 链 接 则 是 在 一 个 页 面 内 书签 之 间 的 跳 转 。 


1. 超 链接 标记 


使 用 超 链 接 标记 二 a 二 … 二 /a 二 可 以 定义 文本 超 链接 和 图 像 超 链 接 。 
定义 文本 超 链 接 的 一 般 格式 为 : 


<a href = "href - value" target = "target - window"> 文 本 </a> 
如 果 是 在 图 片上 建立 超 链接 ,一般 形式 为 : 
<a href = "href ~ value" target = "target - window">< img src= "imge— url"></a> 


其 中 ,在 默认 情况 下 , 当 鼠 标 指针 移 到 建立 了 超 链接 的 文本 或 图 片上 方 时 ,指针 变 成 手 
形 ,表示 文本 或 图 片 对 应 一 个 超 链接 。 

下 面 介绍 过 a> 标 记 的 主要 属性 及 功能 。 

(1) href 属性 ,设置 被 链接 文档 的 url 地 址 。 一 般 形 式 是 : 


href = "url[ # bookmark - name][?para = value&para = value… ]" 


其 中 ,url 为 一 个 网 址 ,bookmark-name 是 书签 名 ,para 为 参数 ,value 是 参数 值 。 它 们 
不 一 地 能 全 部 出 现 ,若是 多 个 参数 ,参数 名 、 参 数值 对 之 间 用 “& "分割 。 除 了 上 述 设 置 为 一 
个 完整 的 网 址 外 ,href 可 以 有 多 种 特殊 的 形式 ,如 下 所 示 。 

QO@ href==“#”, 表 示 本 页 ,这 通常 和 onclick 属性 联合 使 用 。 

@ href 二 "#name", 定 位 到 当前 文档 的 name 书签 位 置 。 

@ href 二 "", 定 义 一 个 空 超 链接 , 即 不 指向 任何 超 链 接 位 置 。 

@ href 属性 为 一 段 javascript 代码 。 例 如 : 


<a href = "javascript:alert( ' 选 择 搜索 引擎 ,然后 单 击 下 一 步 ')"> 下 一 步 </a> 


(2) target 属性 ,定义 单 击 超 链 接 时 打开 的 目标 窗口 。 一 般 形式 是 target 王 "window- 
name" ,window-name 可 以 取 下 面 的 常量 : _self( 相 同 框架 )、blank( 新 建 窗口 )、top( 整 
页 )、parent( 父 窗口 ) ,或 者 是 一 个 存在 的 帧 名 (frame 或 iframe)。 

(3) title 属性 ,属性 值 为 一 个 字符 串 ,鼠标 指针 指向 超 链接 时 ,指针 右 下 角 显 示 标 题 
文本 。 

通过 title 和 href 二"" 空 超 链接 属性 结合 ,可 以 产生 特定 的 效果 。 对 尚未 完成 的 超 链接 
显示 一 个 提示 信息 , 当 超 链接 页 面 完成 后 ,再 给 href 属性 赋 具 体 的 url 值 。 例 如 : 


<a href = "" title= "is building now… "> 学 习 论 坛 </a> 


如 果 在 提示 信息 中 ,需要 换行 ,可 以 使 用 *&& #13;” 或 “& #10;” 来 完成 换行 输出 。 
例如 : 
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title = "提示 : &#13; 来 宾 无 此 权限 " 


(4) onclick 属性 ,接受 鼠标 单 击 , 如 果 返 回 true, 则 页 面 跳 转 到 href 指定 的 网 页 ,否则 ， 
不 执行 href 属性 所 定义 的 网 页 。 

例如 : 

<a href ="#" onclick = "window. opener = null;window. close( )"> 关 闭 </a> 


<a href = "http://www. google. com" onClick = "alert(' 使 用 Google 搜索 引擎 '); return(true)"> 
<a href = '#'onclick = "location = 'aaa. html'; return false;"> bbb</a> 


(5) disabled 属性 ,开关 属性 ,无 须 赋 值 。 设 置 超 链 接 显 示 灰 化 ,不 可 用 。 
2. 定义 书签 


对 于 一 个 完整 的 文件 ,可 以 用 它 的 URL 来 唯一 地 标识 它 , 但 对 于 一 个 文件 的 不 同 部 
分 ,怎样 来 标识 呢 ? 这 就 是 书签 的 概念 , 它 是 通过 链接 标记 来 定义 的 。 在 文档 内 部 可 以 定义 
书签 ,书签 是 通过 a 二 标记 的 name 属性 定义 的 ,标识 一 个 书签 的 方法 为 : 


<a name = "bookmark - name"> 书 签 文本 </a> 


name 属性 将 放置 该 标记 的 地 方 标记 为 一 个 名 为 bookmarkname 的 书签 ,书签 必须 是 一 
个 全 文 唯一 的 标记 串 。 有 了 书签 后 ,href 属性 除了 指向 一 个 网 址 外 ,还 可 以 定位 到 网 页 内 一 
个 具体 的 书签 ,用 法 是 href 二 "url# bookmark-name" ,如 果 是 同一 个 页 内 ,可 以 写成 href= 
"#bookmark-name", 同 一 网 页 内 书签 名 不 能 重 名 。 书 签 文本 可 以 为 空 。 

【 例 3-4】 有 两 个 网 页 pl. htm 和 p2. htm, 要 求 在 pl 中 建立 一 个 超 链接 以 链接 到 
p2. htm,p2. htm 中 有 两 个 超 链 接 ,一 个 返回 pl. htm, 一 个 关闭 p2. htm 页 面 。 

下 述 是 两 个 网 页 的 代码 清单 。 

代码 清单 : pl. htm 


html > 

<head> 

< meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"> 
<title> 页 面 -1 </title> 

</head> 

<body> 

<p><a href = "p2. htm"target = "_self"> 打 开 网 页 2</a></p> 

</body> 

</html > 


代码 清单 : p2. htm 


< html > 

<head> 

< meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"> 
<title> 页 面 -2</title> 

</head> 

<body> 

<p> 

<a href ="#" onclick= "history. go(-1);return false; "> 返回 </a> 
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</p> 

<a href ="#" onclick = "window. opener = null;window. close()"> 关 闭 </a> 
</body> 

</html > 

3.2.7 表格 


表格 (table) 是 网 页 制作 中 安排 布局 最 好 的 工具 ,因为 表格 不 但 可 以 很 好 地 安排 文本 或 
图 像 的 显示 位 置 ,而 且 还 可 以 任意 进行 背景 和 前 景 颜色 的 设置 。 在 HTML 中 ,表格 是 由 
< 一 table 盖 … 一 /table 之 标记 对 创建 的 ,每 个 一 table 之 … 一 /table 二 标记 对 之 间 包 含 若干 一 tr 二 … 
去 /tr> ,一 个 <<tr> 雪 /tr 定义 表格 中 的 一 行 。 每 一 个 和 <tr 之 … 去 /tr 标记 对 又 包括 若干 
个 <td>…<</td> 标 记 对 ,每 一 对 二 td 之 二 /td 之 标记 行内 的 一 个 单元 格 。 

此 外 ,还 可 以 将 表格 分 割 成 三 个 部 分 , 即 表 头 .正文 和 脚注 ,分 别 用 过 thead>、 二 tbody 和 
< 到 tfoo> 来 标记 ,它们 都 是 由 表格 行 构成 ,通过 对 二 tbody 之 过/tbody 之 标记 进行 操作 ,可 以 
控制 部 分 行 的 显示 与 隐藏 。 表 格 标记 (到 table 之 )\ 行 标记 (一 tr 过) .单元 格 标记 (一 td 二 )、 
表 主 体 标记 (二 tbody) 属 性 如 表 3-4 所 示 。 


表 3-4 表格 , 行 及 单元 格 等 标记 属性 列表 


标 记 常用 属性 
id, 标 识 一 个 表格 ; style, 设 置 表格 样式 ; class ,设置 表 格 样式 类 
width、height, 设 置 表格 的 宽度 和 高 度 ,可 以 是 像素 值 ,如 width 二 "200", 或 窗口 总 宽度 的 
百分比 ,如 width=="80%" 
de bordr, 设 置 边 框 的 宽度 , 若 不 设置 此 属性 , 则 边框 宽度 默认 值 为 0, 即 无 边框 ,无 表格 线 ; 
bordercolor, 设 置 边框 的 颜色 
表格 标记 
bgcolor ,设置 表格 的 背景 色 ; background ,设置 背景 图 片 
cellspacing ,设置 单元 格 间距 , 即 单元 格 之 间 空 间 的 大 小 ,默认 值 是 2 
cellpadding ,设置 衬 距 , 即 单元 格 内 部 内 容 之 间 与 边框 的 距离 
align, 设 置 表格 的 浮动 对 齐 方式 ,只 有 left 和 right 两 种 对 齐 方式 
<tr> hight, 设 置 行 高 ; width, 设 置 行 的 宽度 
行 标记 align valign, 设 置 水 平和 垂直 对 齐 方式 
id, 标 识 一 个 表格 ; style, 设 置 表格 样式 ; class, 设 置 表格 样式 类 
去 区 hight, 设 置 行 高 ; width, 设 置 行 的 宽度 
单元 格 标记 align ,valign, 设 置 水 平和 垂直 对 齐 方式 
colspan, 设 置 一 个 单元 格 跨 占 的 列 数 ; rowspan, 设 置 一 个 单元 格 跨 占 的 行 数 
nowrap, 禁 止 单元 格 内 的 内 容 自 动 换行 
二 tbody> | 可 以 将 若干 行 定义 为 一 个 <<tbody> ,每 个 tbody 由 若干 行 构成 。 一 个 表格 可 以 定义 多 个 
表 主 体 标 记 | 二 tbody> ,通过 脚本 程序 可 以 控制 它们 的 显示 和 隐藏 
生计 | 表 头 标记 用 于 定义 一 个 表格 的 表 关 ,由 若干 行 构成 ,使 用 较 少 
=tfoot> 


表 脚 注 标 记 


表 脚 注 标记 用 于 定义 一 个 表格 的 表 脚注 ,由 若干 行 构成 ,使 用 较 少 
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在 HTML 4 中 ,要 对 表格 进行 更 加 精细 的 设置 .可 以 使 用 标记 的 style 样式 或 class 样 
式 类 。 

【 例 3-5】 定义 一 个 高 、 宽 为 300 像素 X200 像素 的 3X2 的 表格 ,要 求 其 在 页 面 中 水 平 
和 垂直 方向 居中 显示 。 

分 析 : 表格 的 水 平 居 中 容易 做 到 ,只 要 设置 一 table 之 的 align 王 "center" 即 可 ,但 垂直 方 
向 的 居中 , 则 没有 合适 的 属性 设置 。 为 此 ,可 以 使 用 表格 谋 套 ,首先 定义 一 个 1X1 表格 , 设 
管 其 width 和 height 属性 均 为 100% ,然后 在 这 个 唯一 的 单元 格 内 定义 所 要 的 3X2 的 表 
格 ,并 设 定 该 单元 格 的 align 属性 为 center。 示 例 代码 如 下 : 


< html> 
< head> 
<meta http - equiv = "Content - Type" content = "text/html; charset = gb2312"> 
</head> 
<body> 
<table border = "0" width= "100%" height = "100%"> 
<tr> 
<tdalign= "center"> 
<table border = "1" width = "300" height = "200" id = "tablel"> 
<tr height = "50"> 
<td width= "100"> </td> 
<td> </td> 
</tr> 
> 
<td> </td> 
<td> </td> 
</tr> 
</table> 
</td> 
</tr> 
</table> 
</body> 
</html > 


在 定义 表格 时 ,如 果 使 用 FrontPage 等 页 面 制 作 工 具 , 生 成 的 表格 属性 设置 很 乱 ,此 时 
应 该 对 代码 进行 手工 调整 ,一般 的 设置 如 下 。 

(1) 为 避免 因 浏览 器 窗口 大 小 改变 而 影响 表格 显示 ,设置 表格 的 宽度 为 绝对 像素 值 ,而 
不 是 比例 ,例如 可 设置 width 二 "300", 而 不 是 "85%"。 

(2) 行 的 高 度 设置 应 在 二 tr 二 标记 中 ,设置 height 属性 ,而 不 要 在 每 个 单元 格 标记 二 td 二 
中 设置 height 属性 。 

(3) 单元 格 一 般 需 设置 width 属性 ,如 果 有 多 个 单元 格 ,最 后 一 个 单元 格 不 需要 设置 
width 属性 。 如 果 有 多 行 , 只 需要 在 第 一 行 设置 单元 格 宽度 ,后 续 行 将 按照 第 一 行 的 宽度 ， 
不 需要 每 一 行 都 设置 单元 格 宽度 。 

【 例 3-6】 使 用 二 tbody 二 标记 ,设计 一 个 具有 标签 功能 的 表格 。 即 设 有 两 个 标签 , 当 鼠 
标 指针 移动 到 第 一 个 标签 上 时 显示 部 分 行 ,移动 到 第 二 个 标签 时 ,显示 另外 若干 行 。 

分 析 : 上 述 页 面 是 我 们 在 互联 网 上 经 常 看 到 的 页 面 功 能 ,从 题目 看 这 是 一 个 具有 交互 
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功能 的 页 面 ,通常 需要 客户 端 脚本 程序 实现 。 在 没有 学 习 JavaScript 以 前 ,我 们 先 给 记 
代码 ,主要 是 让 大 家 体会 表格 中 二 tbody 之 标记 的 应 用 。 

代码 清单 如 下 : 

<html > 

<head> 


<meta http - equiv = "Content — Type" content = "text/html; charset = gb2312"> 
< style type = "text/css"> 


1 实现 


.label - normal 
{ 
background — image:url( 'images/labelbgselect. gif'); 
cursor: hand; 
font — size:13px; 
color: #000000; 
text ~ align:center 
} 
.label - select 
{ 
background — image:url( 'images/labelbgnormal. gif'); 
cursor: hand; 
font - size:13px; 
color: #FF0000; 
font - weight :bold; 
text - align:center 
} 
</style> 
< script language = "javascript"> 
function selCard(n) 
{ 
for(i=0;i< labeltable. cells. length; i++) 
labeltable. cells[i].className = "label - normal"; 
labeltable. cells[n].className = "label - select"; 
// 显 示 tbody 
for(i=0;i< tablel.tBodies. length; i++) 
tablel. tBodies[i]. style. display = "none"; 
tablel. tBodies[n]. style. display = "block"; 
} 
</script > 
</head> 
<body> 
<table id = "labeltable" border = "0" cellspacing = "0" cellpadding = "0"> 
<tr height = 25> 
<td class = "label - select" onMouse0ver = "selCard(0)" width = "130"> 排 行 榜 </td> 
<td class = "label - normal" onMouse0ver = "selCard(1)" width = "130"> 贡 献 度 </td> 
<td class = "label - normal" onMouseOver = "selCard(2)" width= "130"> 其 他 </td> 
</tr> 
</table> 
<table id = "tablel" border = "0" cellspacing = "0" cellpadding= "0" width= "100% "> 
<tbody> 
<tr height = 30> 
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<tdalign= "center" width= "20">< img src = "images/square01.gif"></td> 
<td><a href = "../lanmul - news/news01.htm"> 教 育 部 “十 二 五 ?本 科教 学 工程 </a></td> 
</tr> 
<tr height = "1"> 
< td colspan = 2 background = "images/line01.gif"></td> 
</tr> 
<tr height = 30> 
<td align = "center">< img src = "images/square01.gif"></td> 
<td><a href = "../lanmul - news/news02. htm"> 全 校 核心 通 识 课程 建设 项 目 公 布 </a></td> 
</tr> 
</tbody> 
<tbody style= "display:none;"> 
<tr height = 30> 
<td align = "center">< img src = "images/square01.gif"></td> 
<td><a href ="../lanmu2 - news/news01.htm"> GSL5.0 系统 上 线 预告 </a></td> 
</tr> 
<tr> 
<tdalign= "center">< img src = "images/square01.gif"></td> 
<td><a href = "../lanmu2 - news/news02. htm"> GSL 过 程 管理 问题 答疑 … </a></td> 
</tr> 
</tbody > 
</table> 
</body> 
</html > 


在 浏览 器 上 打开 上 述 页 面 ,显示 结果 如 图 3-3 所 示 。 


号 E:\ 教 村 一 Web 技术 导论 (第 3 版 ) HTIL 表 格 一 例 3 标签 式 网 .-- 人 总 | 贺 
文件 EE) 编辑 EE) 查看 Q) 收藏 @) 工具 中 帮助 0 [3 
四 良 - 加- 国 国名 | 忆 扣 六 kg 天 如 | 全 :总 回 - 

地 址 四) | 忽 ] ?教材 -Ye 技术 导 论 第 3 版 )iTMIL 表 格 -- 例 3 标签 式 网 1 国 | 加 转 到 链接 


排行 榜 贡献 度 
教育 部 “十 二 五 “本 科教 学 工程 


核心 通 识 课程 建设 项 目 公 


图 3-3 标签 式 网 页 的 显示 效果 


3.2.8 表单 


表单 (form) 在 Web 网 页 中 用 来 给 访问 者 填写 信息 ,从 而 能 获得 用 户 信 息 , 使 网 页 具有 


交互 能 力 。 表 单 和 Windows 的 对 话 框 类 似 , 是 由 若干 控件 组 成 的 ,用 于 实现 和 用 户 的 交互 。 
当 用 户 填 写 完 信息 后 做 提交 (submit) 操 作 ,表单 的 内 容 将 从 客户 端的 浏览 器 传送 到 Web 服 
务 器 ,由 Web 服务 器 中 的 相应 的 服务 器 脚本 程序 处 理 。 
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对 于 表单 及 其 包含 的 每 一 个 元 素 ,浏览 器 在 进行 解释 时 都 会 在 内 存 中 创建 相应 的 对 象 ， 
这 和 程序 设计 中 的 变量 说 明 是 一 样 的 ,这 就 为 用 户 对 表单 输入 数据 的 操作 提供 了 技术 上 的 
保证 。 关 于 表单 数据 的 处 理 将 在 本 书 第 5 章 和 第 6 章 进行 讲解 。 本 节 只 介绍 HTML 规范 
中 表单 及 其 元 素 的 标记 语法 。 

表单 标记 、 常 用 的 输入 元 素 标记 、 常 用 属性 及 用 法 如 表 3-5 所 示 。 
表 3-5 表单 标记 、 常 用 的 输入 元 素 标 记 、 常 用 属性 及 用 法 


标记 /输入 类 型 


一 般 形式 


常用 属性 


<form> 
表单 标记 


<form name=" form-name"> 


=</form> 


name 属性 ,表单 名 称 ,用 于 脚本 编程 

action 属性 ,设置 表单 处 理 程序 的 网 络 路 径 和 
程序 名 

method 属性 ,定义 服务 器 表单 处 理 程序 从 表单 
中 获得 信息 的 方式 , 取 值 为 get 或 post 

target 属性 ,设置 action 页 面 输出 的 窗口 


单行 文本 框 输入 


input type= "text" *…> 


type 属性 ,设置 输入 域 的 类 型 

name 属性 ,设置 输入 控件 的 名 字 

value 属性 ,存储 文本 框 的 取 值 ,可 以 设置 一 个 
初始 值 

size 属性 ,设置 文本 框 的 显示 宽度 

maxlength 属性 ,设置 文本 框 中 输入 的 有 效 数据 
长 度 


密码 文本 框 输 入 


< 一 input type= "password"*…> 


同上 


多 行文 本 框 输入 


到 textarea name="" > 
input text 


</textarea> 


name 属性 ,设置 输入 控件 的 名 字 
rows 属性 和 cols 属性 ,分 别 用 来 设置 文本 框 的 
列 数 和 行 数 , 列 与 行 以 字符 数 为 单位 


button 按钮 


一 input type= "button"**> 


name 属性 ,设置 输入 控件 的 名 字 
value 属性 ,value 为 按钮 的 显示 名 称 


radio 单 选 按钮 


过 input type 二 "radio"… 志 文本 


name 属性 , 单 选 按钮 名 称 , 一 般 是 若干 个 radio 
一 组 , 取 相 同 的 name, 构 成 一 组 

value 属性 ,存储 单 选 按钮 的 取 值 ,多 个 具有 相 
同 name 的 单 选 按钮 应 该 具有 不 同 的 value 
checked 属性 ,设置 该 单 选 按 钮 默认 时 是 否 被 
选中 


复 选 框 


input type= "checkbox"*…> 


复 选 框 是 对 某 种 输入 做 出 “是 ”或 “ 否 ”的 选择 。 
属性 设置 同 radio 


复 选 列表 框 


select name="" *…> 
<option value="">*…</option> 
<option value="">*…</option> 


</select> 


name 属性 ,设置 输入 控件 的 名 字 

size 属性 ,设置 下 拉 式 列表 的 高 度 ,默认 值 为 1， 
显示 弹出 式 的 列表 框 。 若 设置 size 的 值 大 于 1， 
则 不 会 有 PopUp 效果 。 如 果 size 小 于 可 选 的 
项 目 数 量 , 则 出 现 垂直 滚动 条 

过 option> 标 记 用 来 指定 列表 框 中 的 一 个 选项 ， 
value 属性 ,用 来 给 一 option 二 指定 的 那 一 个 选 
项 赋值 ,这 个 值 将 传送 到 服务 器 ,服务 器 通过 调 
用 二 select 二 标记 的 name 的 value 属性 来 获得 
该 区 域 选中 的 数据 项 。selected 属性 ,用 来 指定 
默认 选项 
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续 表 


标记 /输入 类 型 一 般 形式 常用 属性 


在 网 页 上 并 不 显示 ,不 需要 用 户 输入 ,主要 用 于 
客户 端 和 服务 端的 数据 传送 

name 属性 ,设置 输入 控件 的 名 字 

value 属性 ,存储 文本 框 的 取 值 

name 属性 ,设置 输入 控件 的 名 字 

size 属性 ,设置 文本 框 长 度 

accept 属性 ,设置 上 载 文件 过 滤 , 即 单 击 “浏览 ” 
按钮 时 ,只 显示 指定 类 型 的 文件 列表 

将 表单 内 容 提交 给 服务 器 

value 属性 ,设置 提交 按钮 的 显示 名 字 , 一 般 为 
表单 提交 <input type= "submit"*…> “确定 ”“ 提 交 ” 等 易于 理解 的 名 字 

onclick 属性 ,设置 表单 提交 前 的 处 理 函 数 、 一 
般 表单 输入 有 效 性 验证 

表单 清除 就 是 要 将 表单 中 已 做 的 输入 和 选择 全 
部 清除 ,重新 填写 


隐藏 元 素 <input type 一 "hidden" …> 


文件 上 传 标记 <input type= "file” *…> 


重 填 按钮 <input type= "reset"**> 


对 于 上 述 表单 及 输入 标记 ,说 明 如 下 。 

(1) 每 个 输入 元 素 都 具有 name 属性 和 value 属性 ,这 是 因为 浏览 器 在 进行 HTML 解 
析 时 ,创建 一 个 HTML DOM 树 , 每 个 标记 对 应 一 个 DOM 树 中 的 节点 对 象 ,标记 的 一 般 属 
性 即 为 对 象 属性 ,事件 属性 则 为 对 象 的 方法 。 标 记 的 name 属性 是 对 象 的 名 称 , 脚 本 程序 可 
以 通过 对 象 名 称 访问 和 操作 节点 对 象 。value 属性 存储 节点 对 象 的 值 。 

(2) form 标记 的 method 属性 ,决定 客户 端 和 服务 端的 HTTP 通信 中 表单 数据 的 传输 
方式 ,也 决定 服务 端 获取 表单 输入 数据 的 方法 。 通 常 有 两 种 方法 。 

@ get 方法 ,将 数据 打包 放置 在 环境 变量 QUERY_STRING 中 作为 URL 整体 的 一 部 
分 传递 给 服务 器 。QUERY_STRING 变量 可 存储 量 是 有 限 的 ,一 般 限制 在 1KB 以 下 。 

@ post 方 法 ,通过 HTTP 的 实体 头 域 传递 数据 到 Web 服务 器 ,没有 数量 限制 。 

(3) 如 果 表 单 中 包含 file 类 型 输入 ,为 了 实现 通过 http 上 传 文件 ,在 表单 标记 所 form> 
中 需要 加 入 编码 方案 属性 enctype 二 "multipart/form-data"。 该 编码 方案 在 传送 大 量 数据 
时 比 默认 的 表单 编码 方案 “application/ x-url-encoded" 效 率 更 高 。 因 为 ,URL 编码 只 有 很 有 
限 的 字符 集 , 当 使 用 任何 超出 字符 集 的 字符 时 ,必须 用 “%nn” 代 替 (nn 表示 两 个 十 进 制 数 )， 
因此 ,通过 URL 编码 方式 上 载 的 文件 大 小 将 是 原来 的 2 一 3 倍 。 

例如 ,有 如 下 代码 : 

< form name = "myForm" method = "POST" action = "/custom/feedback. jsp" enctype = "multipart/ 

form-data"> 


提交 论文 : < input type = "file" name = "Fl1" size= "20"> 
</form> 


显示 结果 为 : 
提交 论文 : 浏览. .. 
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用 户 单 击 * 浏 览 "按钮 ,选择 要 提交 的 文件 ,文件 将 被 上 传 到 Web 服务 器 。 因 为 安全 的 
原因 ,在 HTML 中 ,不 能 设置 上 传 文件 在 服务 器 上 的 存储 路 径 。 上 传 文件 的 存储 路 径 是 在 
表单 处 理 程序 中 设置 的 ,在 Web 服务 器 端 ,通过 组 件 .来 设置 每 一 个 <input type 一 "file" 之 

上 传 文件 的 存储 路 径 。 一 个 HTML 表单 可 以 设置 多 个 <input type= "file" 之 控件 ,从 而 一 
次 上 传 多 个 文件 到 Web 服务 器 。 

【 例 3-7】 设计 一 个 个 人 信息 登记 表 页 面 ,要 求 输入 个 人 姓名 性 别 、 出 生日 期 ,教育 程 
度 、 工 作 单位 .单位 地 址 、 电 话 、 邮 箱 、 个 人 简介 个 人 照片 等 信息 。 

分 析 : 个 人 信息 登记 页 面 应 由 表单 来 实现 ,同时 需要 使 用 表格 进行 页 面 布局 。 设 计 的 
页 面 如 图 3-4 所 示 。 


姓名 人 性别， 男 c 女 | 出 生日 期 ， [0107-07” 。 履 育 程度 ，[ 攻 和 本 

电话 ， 邮箱 ,| 

兴趣 爱好 ， 厂 运动 厂 音乐 厂 其 地 

不 人 耐看 

上 传 个 人 照片 [ | 
2x] me| 


图 3-4 个 人 信息 登记 表 页 面 设计 


代码 清单 : myinfo. htm 


<html> 
<head> 
<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312"> 
</head> 
<body> 
<form name = "forml" method = "POST" action = "myinfo. jsp" enctype = "multipart/form— data"> 
<table border = "1" width= "600" id = "tablel"> 
<tr height = "35"> 
<td width = "160"> 姓 名 : < input type = "text" name = "myname" size= "14"></td> 
<td width = "150"> 性 别 : < input type = "radio" value = "sex" name = "male" checked > 男 < input 
type = "radio" name = "sex" value = "female"> 女 
</td> 
<td width = "170"> 出 生日 期 : < input type = "text" name = "birthday" value = "2010 一 01-01" 
size= "10"> 
</td> 
< td> 教 育 程度 : 
< select size= "1" name = "degree"> 
< option value = "college"> 本 科 </option> 
< option value = "master"> 硕 士 </option> 
< option value = "doctor"> 博 士 </option> 
< option value = "other"> 其 他 </option> 
</select> 
</td> 
</tr> 
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<tr height = "35"> 
< td colspan = "2"> 电 话 : < input type = "text" name = "tel" size = "35"></td> 
<td colspan = "2"> 邮 箱 : < input type = "text" name = "email" size= "37"></td> 
/try 
<tr height = "35"> 
< td colspan = "4"> 兴 趣 爱 好 : < input type = "checkbox" name = " interesting" value = "sports"> 运 
动 < input type = "checkbox" name = "interesting" value = "music"> 音 乐 < input type = "checkbox" 
name = "interesting" value = "other"> 其 他 
</td> 
</tr> 
<tr height = "120"> 
< td colspan = "4"> 个 人 简介 < br>< textarea rows = "6" name = "brief" cols = "92"></textarea> 
</td> 
</tr> 
<tr height = "30"> 
<td colspan = "4"> 上 传 个 人 照片 < input type = "file" name = "F1" size= "65"></td> 
</tr> 
<tr height = "35"> 
<td colspan = "4" align = "center">< input type = "submit" value = "提交 " name = "B1"> 
&nbsp; &nbsp; < input type = "reset" value = " 重 置 " name = "B2"> 
</td> 
</tr> 
</table> 
</form> 
</body> 
</html > 


通过 上 面 的 例子 ,可 以 看 出 以 下 几 点 : 不 是 所 有 的 form 表单 都 需要 提交 到 Web 服 
务 器 处 理 , 即 可 以 没有 action 属性 ; @@ 如 果 是 用 FrontPage 的 table 进行 页 面 布局 ,在 单元 
格 中 插入 form 表单 控件 时 ,生成 的 html 代码 比较 混乱 ,甚至 会 出 现 多 个 form, 此 时 ,要 手 
工 调整 html 代码 ,只 要 将 所 有 的 输入 控件 包含 在 二 form 放 … 三 /form 二 标记 对 之 间 就 可 以 
了 ; @ 在 二 form 这 标记 的 前 后 会 产生 空 行 ,可 将 二 form 放 标记 放 在 二 table 二 标记 的 外 面 。 


3.2.9 层 生 样式 表 技 术 


在 HTML 中 ,大 多 数 标记 都 包含 了 默认 的 显示 样式 ,定义 了 所 标记 内 容 在 浏览 器 中 的 
布局 和 显示 外 观 。 如 果 要 修改 一 个 标记 的 默认 显示 属性 ,需要 通过 标记 的 style 属性 为 标记 
的 相应 属性 赋值 ,这 使 得 标记 更 加 复杂 ,难于 维护 。W3C 为 了 解决 HTML 的 结构 化 问题 和 
实现 Web 中 的 总 体外 观 控制 ,于 1996 年 底 , 公 布 了 层 秋 样式 表 (Cascading Style Sheet， 
CSS) 表 单 规范 。 所 谓 层 琶 是 指 对 于 容器 元 素 指定 的 所 有 选项 ,将 被 自动 地 应 用 到 其 包含 的 
所 有 元 素 中 。 

在 CSS 规范 中 ,定义 了 非常 精细 的 样式 控制 ,不 仅 可 以 在 文档 的 头 部 通过 二 style 二 
二 /style 二 标记 来 修改 默认 显示 样式 和 定义 样式 ,还 可 以 在 标记 内 使 用 style 内 联 样式 ,或 
者 定义 样式 类 ,通过 class 属性 应 用 ,这 就 在 很 大 程度 上 实现 了 内 容 和 显示 的 分 离 , 便 于 页 面 
的 维护 。 
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1. CSS 规范 预定 义 样 式 属 性 


在 CSS 规范 中 ,定义 了 大 量 的 样式 属性 ,利用 这 些 属性 可 以 对 标记 进行 精细 的 设计 , 达 
到 传统 标记 属性 无 法 实现 的 功能 和 效果 。 

CSS 对 网 页 的 控制 是 通过 CSS 属性 实现 的 ,这 些 属性 可 以 分 为 以 下 几 类 。 

1) 字体 属性 

字体 属性 用 来 控制 文本 的 字体 、 字 号 等 ,如 表 3-6 所 示 。 


表 3-6 字体 属性 
属 性 名 功 能 取 值 
font-family 字体 二 字体 名 二 
font-size 字体 大 小 absolute-size>、 < relative-size>\< length>、 
二 percentage 二 等 

color 文字 颜色 志 颜 色 值 二 

font-style 是 否 斜体 normal ,italic .oblique( 与 italic 相同 ) 

font-weight 字体 的 粗细 normal、bold、bolder、 lighter, 也 可 以 用 数值 ， 400 


相当 于 normal,700 相当 于 bold 
font-variant 小 写字 母 改 为 用 大 写 的 小 体 字 normal small-caps 


说 明 : 字体 大 小 的 单位 为 长 度 单位 ,常用 的 单位 有 点 数 (pt) ,像素 (px) 、pica(pc)、ex( 小 
写字 母 x 的 高 度 ) 或 em( 字 体高 度 ) .毫米 (mm)、 厘 米 (cm)、 英 寸 (in)。 在 取 值 一 栏 中 , 写 在 
“一 ”和 “二 ”内 的 表示 是 一 个 用 户 输入 的 数 ,例如 二 percentage 二 表示 可 以 输入 一 个 百分数 ， 
例如 150%。 其 他 的 取 值 为 常量 。 

2) 颜色 和 背景 属性 

颜色 和 背景 属性 用 来 控制 页 面 或 元 素 的 颜色 .背景 颜色 .背景 图 片 等 ,如 表 3-7 所 示 。 


表 3-7 背景 属性 
属 性 名 功 能 取 值 
background-color 背景 颜色 颜色 值 
background-image 背景 图 片 background-image: url( 路 径 / 文 件 名 ) 
background-repeat 背景 图 片 重 复方 式 repeat-x( 沿 水 平方 向 平 铺 ) .repeaty( 沿 
垂直 方向 平 铺 ) ,no-repeat( 不 重复 ) 
background-attachment 背景 滚动 或 固定 fixed( 背 景 固 定 ) scroll( 背 景 与 页 面 一 
起 滚动 ) 
re 背景 图 片 位 置 ( 仅 背景 图 片 不 重 ”二 percentage 二、 到 length 二 、 top 、left、 
复 时 有 效 ) right\bottom center 


3) 文本 间距 与 文本 对 齐 属性 
文本 间距 与 文本 对 齐 属 性 用 来 控制 文本 的 间距 ,段落 的 间距 、 行 高 ` 缩 进 等 ,如 表 3-8 
所 示 。 
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表 3-8 文本 间距 与 文本 对 齐 属性 


属 性 名 功 能 取 值 
word-spacing 单词 间距 normal、 <length> 
letter-spacing 字符 间距 normal,<length> 
none、underline (下 划 线 )、overline( 上 划 线 ) line- 
a A through( 删 除 线 ) blink( 闪 烁 
basline( 在 标准 位 置 ) .sub( 下 标 位 置 ) super( 上 标 位 
置 ) .top( 与 对 象 顶 端 对齐 )、text-top、middle、bottom 
vertical-align 文字 的 垂直 位 置 (与 对 象 底 端 对 齐 ) ,textrbottom、 一 percentage 二 (向 
上 为 正 ,向 下 为 负 ,100% 为 垂直 上 移 一 行 ,-100% 为 
垂直 下 移 一 行 ) 
capitalize( 首 字母 大 写 ) .uppercase (转换 为 大 写 )、 
人 文本 转 欣 为 其 他 形式 lowercase( 转 换 为 小 写 ) ,none( 无 转换 ) 
text-align 对 齐 方 式 left、right、center、justify( 对 齐 每 行 的 文字 ) 
text-indent 首 行 缩 进 <length> ,<percentage> 
line-height 定义 行 高 normal、 <number> ,<length> ,=percentage> 
4) 容器 属性 


容器 是 指 其 中 可 以 包含 内 部 元 素 ,对 象 或 数据 的 元 素 ,如 表格 、 单 元 格 等 ,页 面 也 是 容器 
对 象 。CSS 中 对 这 样 的 对 象 都 统一 用 容器 属性 来 控制 。 它 包括 以 下 子 类 : 边 距 属性 、 填 充 
属性 ,边框 属性 和 图 文 混 排 属性 。 常 用 的 属性 如 表 3-9 所 示 。 


表 3-9 容器 属性 
属 性 名 功 能 取 值 
边 距 属性 (对 象 到 周围 对 象 的 距离 ) 
margin 全 部 边 距 auto,<length> ,=percentage> 
margin-top 顶端 边 距 auto,<length> ,=percentage> 
margin-bottom 底 端 边 距 auto, <length> ,<percentage> 
margin-left 左 侧 边 距 auto,<length> ,=percentage> 
margin-right 右 侧 边 距 auto,<length> ,<percentage> 
边框 属性 
none( 无 边框 ) .dotted( 打 点 边框 .在 大 多 数 浏览 器 
中 会 变 为 线 ) .dash( 断 裂 边 框 、 在 大 多 数 浏览 器 下 
border-style 边框 样式 也 会 变 为 线条 ) 、solid( 实 线 边框 )、double( 双 线条 
边框 )、groove(3D 沟 槽 边框 ) ,ridge(3D 冰 状 边 
框 ) .inset(3D 嵌入 边框 ) .outset(3D 突出 边框 7 
bordertop-width border-style border-color( 同 时 
人 给 定 三 个 属性 值 ,属性 值 之 问 用 空格 分 隔 ,下 同 ) 
border-bottom 底 端 边框 的 三 属性 borderbottom-width border-style\ border-color 
border-left 左 侧 边框 的 三 属性 border-left-width ,border-style, border-color 
borer-right 右 侧 边框 的 三 属性 border-rightwidth border-style\ border-color 
border-width 一 次 定义 边框 宽度 thin ,medium ,thick 一 length> 
border-top-width 顶端 边框 宽度 thin( 细 ) 、medium( 中 ) thick( 粗 )、 达 length 
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续 表 

属 性 名 功 能 取 值 
border-bottom-width | 底 端 边框 宽度 thin、medium.thick.=length> 
border-left-width 左 侧 边框 宽度 thin、medium.thick <=length> 
border-right-width 右 侧 边框 宽度 thin、medium,thick ,<=length> 
border-color 边框 颜色 颜色 值 
衬 距 属 性 (内 容 到 边框 的 距离 ) 
padding 全 部 衬 距 <length> <percentage> 
padding-top 顶端 衬 距 <length> ,=percentage> 
padding-bottom 底 端 衬 距 <length> ,<percentage> 
padding-left 左 侧 衬 距 <length> ,<percentage> 
padding-right 右 侧 衬 距 <length> =percentage> 
图 文 混 排 属性 
width 宽度 属性 auto,<length> ,<percentage> 
height 高 度 属性 auto,<length> 
float 文本 环绕 left ,right .none 
clear 单 边 文本 环绕 left ,right both ,none 


对 于 边框 ,有 三 个 要 素 决 定 , 即 线 宽 . 线 型 和 颜色 ,例如 boder:1px soloid 并 ff0000, 定 义 
了 边框 为 1 个 像素 宽度 、 实 线 、 红 色 的 边框 。 此 外 ,对 于 边 距 属性 ,margin-left、margin-right 
可 以 取 负 数 , 例 如 二 span style 王 "margin-left:-10px" 二 一 /span 二 ,表示 在 正常 输出 位 置 左 
移 10 个 像素 ,这 可 能 会 遮盖 左边 已 有 的 内 容 ,起 一 种 特别 效果 。 


5) 列表 属性 
列表 属性 是 指 用 来 对 列表 进行 控制 的 CSS 属性 ,如 表 3-10 所 示 。 
表 3-10 列表 属性 
属 性 名 功 能 取 值 
none( 不 显示 ) ,block( 以 块 的 形式 显示 ) inline( 以 行内 元 
display 定义 是 否 显示 素 的 形式 显示 ,元 素 的 前 后 不 带 有 换行 ) \listitem( 以 列 
表 的 形式 显示 ) 
列表 项 中 空格 的 处 | normal( 忽 略 空格 和 换行 符 ) .pre( 保 留 空格 和 换行 符 )、 
理 方式 nowrap( 列 表 项 不 自动 换行 ,直到 出 现 <br>> 标记 ) 
disc( 实 心 圆 ) .circle( 空 心 圆 ) 、squre( 实 心 方块 )、decimal 
在 列表 前 加 项 目 | (阿拉 伯 数 字 )、lower-roman (小 写 罗马 字母 )、upper- 
list-style-type 
符号 roman( 大 写 罗马 字母 )、lower-alpha (小写 英文 字母 )、 
upper-alpha( 大 写 英 文字 母 ) .none( 无 ) 
list-style-image 在 列表 项 前 加 图 案 格式 : url(imageURL) .none 


list-style-position 


列表 项 中 第 二 行 的 
起 始 位 置 


inside( 列 表 项 目 符号 在 列表 项 文本 以 内 ,列表 项 文本 与 
项 目 符号 对 齐 ) .outside( 默 认 值 ,列表 项 目 符号 放 在 文本 
以 外 ,列表 项 文本 自身 对 齐 ) 


list-style 


一 次 定义 前 面 的 列 
表 属性 


list-style-type 或 liststyle-image、\list-style-position (同时 
给 定 两 个 属性 值 , 属 性 值 之 间 用 空格 分 隔 ) 
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6) 鼠标 状态 属性 
鼠标 状态 属性 用 来 控制 鼠标 指针 的 形状 ,如 表 3-11 所 示 。 
表 3-11 鼠标 状态 属性 
属 性 名 功 能 取 值 


auto( 自 动 )、crosshair( 定 位 “十 ” 字 )、default( 默 认 指 针 )、 
hand( 手 形 )、move (移动 )、e-resize (箭头 朝 右 方 )、ne- 
resize( 箭 头 朝 右 上 方 )、nw-resize (箭头 朝 左 上 方 )、n- 


SE 指针 效果 resize( 箭 头 朝 上 方 ) se-resize( 箭 头 朝 右 下 方 ) sw-resize 
(箭头 朝 左下 方 ) .s-resize( 箭 头 朝 下 方 )、w-resize( 箭 头 朝 
左 方 ) .text( 文 本 “I” 形 ) 、wait( 等 待 ) .help( 帮 助 ) 
7) 定位 属性 


在 CSS 中 ,提供 了 一 组 定位 属性 ,可 以 对 块 级 元 素 和 行内 元 素 进行 定位 ,改变 正常 的 输 
出 流 结果 ,精确 控制 页 面 上 的 对 象 的 位 置 , 如 表 3-12 所 示 。 


表 3-12 定位 属性 
属 性 名 功 能 取 值 
Position 定义 位 置 absolute( 绝 对 ) .relative( 相 对 ) 、static( 静 态 ) 
left top 水 平 位 置 和 垂直 位 置 length> ,=percentage> .auto 
width height 对 象 的 大 小 、 宽 和 高 <length> ,<=percentage> ,auto 
We 内 容 超出 时 的 处 理 。 ”| autowvisible、hidden( 不 显示 滚动 条 ) .scroll 
overflow-y 
auto、shape (形状 ,有效 的 设置 为 rest (top，right， 
clip 剪 切 
bottom, left) ) 
和 auto\ 一 integer 二 , 当 position 定位 有 层 肝 时 ,z-index 值 大 
Se A 的 在 上 面 , 默 认为 0, 可 取 负数 
visible( 可 见 ) ,hidden( 隐 藏 ) inherit( 继 承 外 层 元 素 的 显 


visibility 设置 可 见 性 示 属 性 ) 

在 HTML 的 输出 中 ,一 div 二 二 p 二 或 二 hl 二 元 素 被 称 为 块 级 元 素 ,这些 元 素 显示 为 一 
块 内 容 , 即 * 块 框 *。 与 之 相反 ,一 span 过 等 元 素 称 为 “行内 元 素 ”( 元 素 前 后 没有 换行 )。 它 们 
的 内 容 显示 在 行 中 , 即 “ 行 内 框 ?>。CSS 为 定位 和 浮动 提供 了 position ,left right top、 
bottom 等 属性 ,利用 这 些 属性 ,对 元 素 在 页 面 的 输出 中 进行 定位 ,定位 的 基本 思想 就 是 允许 
定义 元 素 框 相对 于 其 正常 位 置 应 该 出 现 的 位 置 ,或 者 相对 于 父 元 素 . 另 一 个 元 素 甚 至 浏览 器 
窗口 本 身 的 位 置 。 从 而 建立 列 式 布局 ,将 布局 的 一 部 分 与 男 一 部 分 重生 ,完成 通常 需要 使 用 
多 个 表格 才能 完成 的 任务 。 

关于 position 属性 ,说 明 如 下 。 

(1) relative, 元 素 框 相对 于 原先 正常 输出 偏 移 某 个 距离 。 元 素 仍 保持 其 未 定位 前 的 形 
状 , 它 原本 所 占 的 空间 仍 保留 。 

(2) absolute, 元 素 框 从 文档 流 完全 删除 .并 相对 于 其 包含 块 进行 定位 。 包 含 块 可 能 是 
文档 中 的 另 一 个 元 素 或 者 是 初始 包含 块 。 元 素 原先 在 正常 文档 流 中 所 占 的 空间 会 关闭 ,就 
好 像 元 素 原来 不 存在 一 样 。 元 素 定位 后 生成 一 个 块 级 框 , 而 不 论 原来 它 在 正常 流 中 生成 何 
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种 类 型 的 框 。 
(3) fixed, 元 素 框 的 表现 类 似 于 absolute, 只 是 其 包含 块 是 视窗 本 身 , 即 浏览 器 窗口 。 


2. 样式 表 与 CSS 选择 符 


在 HTML 中 , 除 志 script 二 等 个 别 标记 外 ,几乎 所 有 的 文档 体内 的 标记 都 有 其 默认 
的 显示 样式 ,要 修改 标记 的 默认 显示 样式 ,有 多 种 实现 方法 : 四 在 页 面 的 头 部 (二 head> 
一 /head 盖 ) 内 部 ,使 用 二 style 过 … 一 /style 二 标记 ,定义 样式 表 , 这 样 定义 的 样式 只 在 该 网 
页 发 生 作用 , 称 为 嵌入 式样 式 ; @ 在 标记 中 通过 syles 属性 进行 定义 , 称 为 内 联 样式 表 ; 
@ 将 样式 表 定 义 保存 为 单独 的 样式 表 文 件 , 然 后 在 网 页 中 引用 该 文件 ,在 标记 内 使 用 通过 
class 属性 或 id 属性 进行 设置 。 

样式 表 定 义 的 一 般 形 式 是 : 


<style type = "text/css"> 
选择 符 { 属 性 名 :属性 值 ; 属性 名 : 属性 值 ; … } 
</style> 
所 谓 “ 选 择 符 ”, 可 以 简单 地 理解 为 对 一 个 样式 表 的 命名 ,不 同 的 选择 符 决定 了 样式 的 使 
用 范围 和 使 用 方式 。 在 CSS 中 ,选择 符 分 为 六 类 。 
1) HTML 选择 符 
选择 符 为 标记 名 ,此 时 样式 定义 将 蔡 换 标记 的 默认 显示 ,任何 HTML 标记 都 可 以 作为 
CSS 选择 符 。 
< style type = "text/css"> 
body {color: #ff0000; background: black; } 
p{margin:2px 4px} 
</style> 
上 述 样 式 表 定义 ,将 修改 一 body 王 和 <p 二 标记 的 默认 显示 样式 。 
2) 类 选择 符 
HTML 选择 符 虽然 修改 了 标记 的 默认 显示 样式 ,但 是 同一 标记 的 显示 样式 是 一 样 的 。 
如 果 希 望 同一 标记 有 不 同 的 样式 ,可 以 将 样式 表 定 义 成 一 个 个 的 样式 类 ,选择 符 就 是 样式 类 
的 名 字 , 称 为 类 选择 符 。 样 式 类 可 以 关联 一 个 标准 的 标记 ,也 可 以 用 于 任何 标记 。 定 义 样式 
类 的 语法 格式 为 : 
[HTML 标记 ].< 类 选择 符 > { 
属性 : 属性 值 


[; 属 性 : 属性 值 …] 
} 


例如 : 


.wordl {color: lime; background: #ff80c0 } 

p. warning { font - weight: bolder; color: red; background: white } 

其 中 ,wordl 类 不 隶属 于 任何 标记 ,可 以 用 于 任何 body 元 素 , 因 为 它 在 样式 表 中 没有 和 
具体 的 HTML 元 素 关 联 。 但 warning 类 只 能 用 于 段落 标记 二 p 二 。 
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当 定义 了 样式 类 后 ,类 选择 符 在 标记 中 通过 class 属性 引用 。 例 如 : 


<p class = warning > 警告 : </p> 
<p class = wordl > Please turn off the power first </p> 


3) ID 选择 符 

如 果 一 个 样式 表 在 同一 个 页 面 中 只 出 现 一 次 ,可 以 定义 为 ID 选择 符 ,其 定义 方法 与 类 
选择 符 相 似 ,只 是 在 选择 符 的 前 面 用 “ # ”而 不 是 “.”。 在 HTML 规范 中 ,id 属性 是 一 个 标 
记 的 标识 ,通过 id 属性 可 以 访问 一 个 标记 或 对 其 进行 操作 。 一 个 页 面 中 ,不 能 有 两 个 相同 
的 id。 在 HTML 规范 中 ,如 果 从 大 的 设计 出 发 ,我 们 会 发 现 有 些 内 容 是 许多 页 面 都 有 的 ， 
例如 页 面 的 标题 、 页 面 的 脚注 等 。 对 于 这 些 公有 的 部 分 ,可 以 直接 设置 它们 的 内 容 和 显示 方 
式 , 这 就 是 说 通过 它 的 id 来 设置 样式 。 

和 使 用 标记 的 class 属性 相 比 ,在 布局 思路 上 ,一 般 坚 持 这 样 的 原则 : id 是 先 确定 页 面 
的 结构 和 内 容 , 然 后 再 为 它 定义 样式 ; 而 class 相反 , 它 先 定义 好 一 类 样式 ,然后 在 页 面 中 根 
据 需要 把 类 样式 应 用 到 不 同 的 元 素 和 内 容 上 面 。 在 实际 应 用 时 ,class 更 多 地 被 应 用 到 文字 
版 块 以 及 页 面 修饰 等 方面 ,而 id 更 多 地 被 用 来 实现 宏伟 布局 和 设计 包含 块 或 包含 框 的 
样式 。 

例如 : 


#1location— table{ 
border :Opx; 
cellspacing:0px; 
cellpadding:0px; 

} 

#help- table{ 
border:1px solid #0163A2; 
cellspacing:5px; 
cellpadding:px; 
font - family: 宋 体 ; 
font — size: 12px; 
color: # FFO0000; 
line— height:150%; 

} 

#foot— table{ 

margin - top:15px; 
height:65px; 

font - family: 宋 体 ; 

font — size:12px; 

Color: # FFFFFF; 

text - align:center; 

line - height:150%; 
background — color: # dOdOcf; 

} 


上 述 id 设 定 用 于 每 一 个 页 面 中 的 当前 位 置 、 帮 助 信息 以 及 版 权 信息 的 设 定 。 在 每 一 个 
页 面 中 ,这 是 一 样 的 。 
当 将 样式 表 定 义 成 id 选择 符 后 ,在 标记 中 通过 id 属性 设置 为 id 选择 符 即 可 ,需要 注意 
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的 是 ,在 同一 个 网 页 中 ,标记 的 id 值 应 该 是 唯一 的 ,不 能 重 名 。 

4) 关联 选择 符 

关联 选择 符 是 由 两 个 或 更 多 的 单个 选择 符 组 成 的 串 , 由 于 层 琶 顺序 的 关系 ,关联 选择 符 
的 优先 权 更 大 。 关 联 选择 符 只 对 选择 符 的 最 内 层 元 素 起 作用 ,对 单独 的 外 层 元 素 无 定义 。 
定义 关联 选择 符 时 ,单独 的 选择 符 之 间 用 空格 分 开 。 

例如 : 


table afcolor:red} 


它 定义 了 过 table 二 内 的 超 链 接 标 记 二 a 二 的 样式 ,对 于 二 table 二 标记 本 身 ,以 及 二 table 二 
标记 外 的 二 a 二 没有 影响 。 

5) 组 合 选择 符 

将 多 个 选择 符 共 用 一 个 样式 表 定 义 , 避 免 样式 表 定 义 的 重复 ,这 就 是 组 合 选择 符 。 定 义 
组 合 选择 符 ,单个 选择 符 之 间 用 西 文 的 ",” 分 割 。 

例如 : 


hl, h2{color:red} 


则 过 hl 二 和 二 h2 二 标记 定义 为 红色 。 

6) 伪 元 素 选择 符 

它 主 要 定义 超 链 接 标 记 二 a 二 ,目的 是 定义 不 同 状 态 下 同一 个 HTML 元 素 的 形态 。 例 
如 , 单 击 前 , 单 击 后 、 光 标 移动 到 超 链接 文本 上 时 ,这 些 不 同 的 状态 超 链接 显示 不 同 。 

例如 ,要 个 性 化 超 链 接 的 显示 ,可 以 定义 下 面 的 样式 。 


< style type= "text/css"> 
a {color: #0000FF; font - size:12px; text - decoration:none} 
a:link{ 
color: #00FF00; 
text — decoration:none 
} 
a:visited{ 
color: # 00FFOO0; 
text — decoration:none 
} 
a:hover { 
color: # FF0000; 
font — weight:bold; 
text — decoration:none 
} 
a:active { 
color: # 0000FF; 
text — decoration:none 
} 
</style> 


这 样 ,对 于 文档 中 的 超 链接 (二 a 宝 … 二 /a 二 ) ,文字 显示 为 蓝 色 , 当 鼠标 指针 指向 的 时 候 
则 显示 红色 ,同时 字体 也 加 粗 显 示 ,不 显示 下 划 线 。 对 于 访问 过 的 页 面 , 超 链接 显示 为 绿色 ， 
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指针 指向 时 ,颜色 不 变 。 

特别 说 明 : 在 CSS 定义 中 ,a:hover 必须 位 于 a:link 和 a:visited 之 后 ,才能 生效 ; a: 
active 必须 位 于 a:hover 之 后 ,才能 生效 。 

要 修改 一 个 标记 的 默认 属性 ,需要 知道 这 个 标记 有 哪些 属性 , 记 住 一 个 标记 的 所 有 属性 
是 很 困难 的 ,这 需要 借助 于 FrontPage、Dreamweaver 等 网 页 制作 工具 来 定义 样式 。 例 如 ， 
在 FrontPage 中 ,通过 “格式 ”样式 ”命令 ,可 以 修改 标记 的 默认 样式 ,或 者 新 建 样式 类 , 创 
建 css 文件 等 。 


3. 标记 的 style 属性 与 内 联 样式 


要 修改 标记 的 默认 显示 样式 ,还 可 以 设置 标记 的 style 属性 来 实现 ,这 种 修改 只 针对 当 
前 一 个 标记 ,不 影响 其 他 同名 的 标记 ,从 而 实现 标记 按照 特定 的 形式 显示 ,这 就 是 内 联 样 式 。 
例如 


<p style = "color: red; font - family:'Impact'"> 红 色 英 文 Imapct 字 , 如 果 字 体 可 用 的 话 .</p> 
要 使 用 内 联 样式 ,必须 在 文档 的 二 head 二 … 王 /head 二 部 分 包括 以 下 标记 : 
<meta http— equiv = "Content - Type" content = "text/css"> 


内 联 样式 可 以 改变 标记 的 默认 显示 样式 ,如 果 需 要 多 个 标记 使 用 同样 的 样式 显示 时 , 需 
要 为 每 一 个 标记 添加 style 属性 ,非常 麻烦 。 另 外 ,内 联 样式 和 需要 展示 的 内 容 混合 在 一 起 ， 
显得 比较 混乱 ,修改 不 够 方便 ,这 本 身 也 是 HTML 规范 的 一 大 弊端 。 

总 之 ,style 属性 可 以 改变 标记 的 默认 显示 样式 ,采用 style 属性 管理 大 量 文档 的 显示 将 
十 分 困难 。 当 管理 人 员 需 要 改变 某 些 标记 的 显示 形式 时 ,需要 做 大 量 的 微调 工作 。 要 解决 
站 点 级 的 显示 问题 ,内 联 样式 将 非常 困难 ,必须 借助 于 样式 表 。 


4. 样式 表 (.css) 文 件 


在 HTML 文档 的 王 head 之 …</head 盖 标记 内 ,通过 到 style 之 … 一 /style 二 定义 的 样 
式 ,id 样式 还 是 class 样式 类 ,只 能 应 用 于 当前 的 HTML 文档 。 如 果 要 将 这 些 样 式 应 用 到 
其 他 HTML 文档 中 ,应 该 使 用 样式 文件 。 即 ,将 这 些 样 式 定义 存储 在 一 个 扩展 名 为 . css 的 
样式 文件 中 ,css 文件 可 以 是 一 个 标准 的 HTML 文件 ,只 不 过 二 body 记 … 二 /body 二 为 空 。 
然后 , 当 某 个 网 页 需要 使 用 其 中 的 样式 时 ,在 文档 的 二 head 二 … 二 /head 二 中 增加 二 link 二 
标记 ,一 般 形 式 如 下 : 


< link type = "text/css" rel = "stylesheet" href = "mystyle. css"> 


这 样 , 在 当前 文档 中 ,就 可 以 使 用 样式 文件 mystyle. css 中 定义 的 样式 了 。 

一 种 良好 的 HTML 页 面 就 是 充分 利用 CSS 技术 ,将 页 面 的 显示 和 布局 分 开 , 从 而 保证 
页 面 维 护 的 灵活 性 。 

【 例 3-8】 设计 表格 样式 ,绘制 线 宽 为 1 的 表格 线 ,并 设计 表格 的 标题 行 单元 格 样式 。 

分 析 : 在 HTML 中 ,表格 是 由 一 个 个 的 单元 格 组 成 的 ,每 个 二 table 二 标记 和 二 td 二 标 
记 都 有 边框 ,因此 ,即使 设置 表格 的 cellspacing 二 "0" ,表格 的 边框 也 是 两 个 像素 的 线 宽 。 要 
实现 一 个 像素 的 表格 线 , 需 要 设计 二 table 二 和 二 td 放 的 边框 css 属性 。 


(1) 样式 表 文 件 mytable. css。 
代码 清单 : mytable. css 


.table - hasframe 

{ 
margin— top:15px; 
border — left:1px solid #0163A2; 
border - bottom:1px solid #0163A2; 
font — size:12px; 
background — color: # FFFFFF 

} 

.Cell -title 

{ 
border - top:1px solid #0163A2; 
border - right:1px solid # 0163A2; 
font - weight :bold; 
text — indent :Opx; 
line— height:150%; 
text ~ align:center; 
vertical ~- align:middle; 

} 

‘Cell— normal 

{ 
border - top:1px solid #0163A2; 
border - right:1px solid #0163A2; 
padding — left:5px; 
text — indent :Opx; 
vertical ~ align:middle; 


} 
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在 上 述 的 css 文件 中 ,定义 了 一 个 表格 样式 ,定义 了 其 上 边 距 、 左 边框 和 下 边框 。 两 种 
单元 格 样式 类 ,都 定义 了 上 边框 和 右边 框 。 这 样 只 要 在 应 用 上 述 样式 类 时 ,设置 二 table 二 


的 cellspacing 王 "0", 即 可 实现 1 个 像素 的 表格 线 。 
(2) 在 页 面 中 应 用 样式 表 文件 。 
代码 清单 : mytable. htm 
<html> 


<head> 
<meta http— equiv = "Content - Language" content = "zh 一 cn"> 


<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312"> 


< link rel = "stylesheet" type= "text/css" href = "mytable. css"> 
</head> 
<body> 
<table class = "table — hasframe" width = "100%" cellspacing= "0"> 
<tr height = "35"> 
<td class = "cell -title" width = "70"> 序 号 </td> 
<td class = "cell- title" width = "100"> 留 言 人 </td> 
<td class = "cell - title"> 标 题 </td> 
</tr> 
<tr height = "30"> 
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< td class= "cell— normal" align= "center"> 1 </td> 
< td class = "cell - normal" align = "center"> 圳 鞭 著 </td> 
< td class = "cell - normal"> 在 CSS 中 ,利用 id 和 class 设置 标记 样式 有 什么 不 一 样 ? 
</td> 
w/tr> 
<tr height = "30"> 
<tdclass= "cell— normal" align= "center"> 2 </td> 
<td class = "cell - normal" align = "center"> 郭 晶 </td> 
<td class = "cell - normal"> 如 何 设置 段落 的 行距 ?</td> 
</tr> 
</table> 
</body> 
</html > 


在 浏览 器 中 打开 上 述 页 面 ,显示 结果 如 图 3-5 所 示 。 


滞 E:\ 教 材 一 web 技术 导论 (第 3 版 ) vaytable-hta - Hicrosoft... 攻 ] 操 | 贺 
文件 EE 编辑 EE) 查看 收 蕊 和) 工具 GD) 帮助 


@FE- 昌 - 国 国 次 | 只 扫 索 玄 收 BV 全 | 全 -总 回 


在 CSs 中 ,利用 ia 和 class 设 置 标记 样式 有 什么 不 一 样 ?了 
如 何 设置 段落 的 行距 ? 


图 3-5 一 个 像素 的 表格 线 表格 


3.2.10 二 div 请 标记 和 二 span 二 标记 


为 了 更 好 地 实现 元 素 的 精确 定位 ,浏览 器 厂商 在 HTML 规范 基础 上 ,在 网 页 中 增加 了 
层 和 位 置 的 概念 。 通 过 层次 块 的 显示 、 隐 藏 和 移动 来 实现 灵活 的 页 面 显示 效果 。 同 时 ,为 了 
动态 地 改变 页 面 上 一 些 区 域 的 显示 ,还 引入 了 去 span 过 标记, 它 是 一 种 类 似 行内 占 位 的 标 
记 。 和 其 他 html 元 素 不 同 ,二 div 王 和 二 span 一 没有 默认 的 显示 样式 ,因此 ,用 户 必 须 通 过 
style 属性 或 class 属性 来 设置 样式 ,来 构造 丰富 的 页 面 布局 。 


1. 图 层 标记 壹 div 过 
层次 块 标记 一 div 之 …</div 之 用 于 定义 网 页 上 的 一 个 矩形 块 ,中 间 可 以 包含 引起 行 中 
断 的 标记 ,如 二 table 二 标记 等 。 层 次 块 标记 的 一 般 形式 是 : 


<div id= "idname" style= "divstyle" > 
</div> 


主要 属性 有 : 
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(1) id 属性 ,用 于 标识 一 个 一 div 二 块 , 通 过 id 可 以 引用 该 块 或 对 图 层 进行 操作 。 

(2) style 属性 ,定义 图 层 块 的 位 置 , 大 小 .显示 属性 等 。 

此 外 ,图 层 还 可 以 接受 onclick 等 鼠标 事件 ,来 增加 交互 功能 。 

通常 情况 下 ,在 网 页 上 ,可 以 用 一 div 之 和 二 /div 之 标记 来 定义 一 个 矩形 区 域 , 即 定义 一 
个 图 层 块 ,通过 图 层 块 的 style 属性 操作 ,来 得 到 一 些 特殊 的 效果 。 通 过 客户 端 程序 ,可 以 实 
现 对 区 域 的 显示 、 隐 藏 和 移动 等 操作 。 如 果 没 有 层次 块 ,要 实现 一 个 区 域 , 例 如 一 个 table 
的 移动 是 很 不 方便 的 。 

【 例 3-9】 图 层 的 显示 或 隐藏 。 

分 析 : 在 许多 Web 应 用 系统 的 页 面 设 计 中 ,通常 使 用 图 层 来 显示 一 些 帮 助 信 息 , 通 过 
单 击 来 显示 或 隐藏 图 层 。 例 如 ,我 们 在 开发 GSL 系统 时 ,设计 的 页 面 如 图 3-6 所 示 。 


个 教学 班 ， 孝 学 焉 可 以 包 皇 多 个 不 同 的 物理 竹 ， 对 王选 修 课 ， 一 个 教学 计 入 的 者 学 班 ， 可 上 
分 同学 。 与 一 个 教学 计划 jp 有 一 个 叭 一 的 教学 计划 | 号 ， 教学 计划 号 = 课程 代码 + 课程 | 硕 序号 。 


图 3-6 图 层 的 显示 和 隐藏 设计 


当 用 户 在 “教学 计划 列表 "文本 上 单 击 时 ,显示 “系统 帮助 ”图 层 , 再 次 单 击 ,隐藏 该 图 层 。 
示例 代码 如 下 : 


< htm]l > 
<head> 
< meta http-equiv = "Content - Type" content = "text/html; charset = gb2312"> 
< link rel = "stylesheet" type = "text/css" href = "pubcss/linestable. css"> 
< link rel = "stylesheet" type = "text/css" href = "pubcss/common.css"> 
< script language= "javascript"> 
function showorhide div(id) 
{ 
if (document.all. item(id). style. display == "none") 
document.all. item( id). style. display = "block"; 
else 

document.all. item( id). style. display = "none"; 
} 
</script > 
</head> 
<body> 
<table class = "location— table" width="97%"> 
<tr height = "35"> 

< td class = "location - title”colspan = "2"> 您 的 位 置 : 教学 计划 管理 ><a href ="#" 
onclick = "showorhide_div( 'helpdiv')"> 教 学 计划 列表 </a></td> 
</tr> 
<tr height = "35"> 

<tdalign= "right"> 
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<a href = "addbook - groupslist. jsp"> 添 加 班级 </a> | 
<a href = "addbook - personadd. jsp"> 添 加 单个 学 生 </a> 
</td> 
</tr> 
</table> 
<div id= "helpdiv" style= "border:0px solid #0163A2;padding:5px;display:none"> 
<table class = "banner - table" style = "width:97% ;margin - bottom:20px" cellpadding = "0" 
border = "0"> 
<tr height = "20"> 
<td class = "menuposword" width= "975% " align= "left"> 系 统 帮助 : </td> 
<td rowspan = "2"> 
<a href ="#" onclick = "showorhide div('helpdiv')">< font face= 'Ningdings' color = 
'#FF0000' style= 'font — size:32pt>r</font></a> 
<td> 
</tr> 
<tr class = "bannerword" height = "20"> 
<td align = "left"> 一 项 教学 计划 对 应 一 个 教学 班 ,教学 班 可 以 包括 多 个 不 同 的 物理 班 ; 对 于 选 
修 课 , 一 个 教学 计划 的 教学 班 ,可 以 是 某 些 班 的 部 分 同学 .每 一 个 教学 计划 都 有 一 个 唯一 的 教学 计划 
号 ,教学 计划 号 = 课程 代码 + 课程 顺序 号 . 
</td> 
</tr> 
</table> 
</div> 
<table border = "1" width= "97%" id= "tablel"> 
去 > 
<td> </td> 
<td> </td> 
</tr> 
</table> 
</body> 
</html > 


上 述 代 码 中 ,涉及 脚本 程序 和 CSS 技术 ,这 在 接 下 来 的 小 节 中 介绍 。 在 默认 状态 下 ,图 
层 占 整个 窗口 的 宽度 , 且 不 显示 图 层 区 域 的 边界 ,可 以 设置 style 二 "border: 1px solid 井 
0163A2" 来 显示 图 层 的 边框 ,以 便 对 图 层 有 个 更 直观 的 认识 。 


2. 区 段 标记 一 span 二 


< 二 span 盖 元 素 不 同 于 一 般 的 HTML 元 素 , 它 没有 自己 的 显示 内 容 和 显示 特性 。 引 入 
去 span 盖 标记 的 目的 是 定义 一 个 行内 区 域 ,可 以 给 这 个 区 域 一 个 id 属性 ,结合 CSS, 对 该 区 
域 设 定 特定 的 样式 ,以 得 到 需要 的 显示 效果 。 也 可 以 使 span 标记 的 区 域 响应 鼠标 或 键盘 事 
件 , 制 作 菜 单 、 树 形 结构 目录 、 列 表 框 及 下 拉 列 表 框 项 目 。 和 二 div 二 标记 相 比 ,二 span 志 在 
CSS 定义 中 属于 一 个 行内 元 素 ( 元 素 前 后 没有 换行 ) ,而 一 div 之 是 块 级 元 素 ,我 们 可 以 通俗 
地 理解 为 二 div 之 为 大 容器 ,二 span 之 就 是 小 容器 ,在 一 个 所 div 之 中 可 以 包含 若干 span 

【 例 3-10】 一 span 二 标记 应 用 示例 。 

分 析 : 在 Web 应 用 的 开发 中 ,有 时 候 需 要 动态 地 改变 页 面 上 一 些 地 方 的 内 容 , 比 如 单 
元 格 ,文本 内 部 等 。 对 于 单元 格 , 它 是 由 二 td 请 标记 定义 的 ,因此 可 以 访问 ,但 如 果 是 一 段 文 
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本 的 一 部 分 , 则 没有 特别 的 标记 就 无 法 访问 了 ,此 时 ,可 使 用 过 span 之 标记 标记 需要 操作 的 
文本 。 
代码 清单 : exa3-10 . htm 


<htm]l > 
<head> 
<meta http - equiv = "Content - Type" content = "text/html; charset = gb2312"> 
< script language = "javascript"> 
function setspan(spid, flag) 
{ 
if(flag==1) 
// 使 用 函数 参数 访问 span 对 象 
document.all. item( spid). innerHTML = "< font color = red size=7> Hao </font >"; 
// 直 接 使 用 < span > 标记 的 id 访问 对 象 
sp2. style. display = "inline"; 
sp3. style. display = "none"; 
} 
if(flag==2) 
{ 
document.all. item( spid). innerHTML = "< font color = red size = 7>Jiang </font >"; 
sp2. style. display = "none"; 
sp3. style. display = "inline"; 
} 
} 
</script > 
</head> 
<body> 
<a href = javascript: setspan( 'sp1',1)> Mr. Hao </a></br> 
<a href = javascript: setspan( 'spl', 2)> Miss. Jiang </a></br> 
<p> 亲 爱 的 < span id = spl > xxx</span>< span id = sp2 style = "display:none"> 先 生 </span>< span 
id= sp3 style= "display:none"> 女 士 </span></p> 
</body> 
</html > 


运行 上 述 代 码 , 显 示 结 果 如 图 3-7 所 示 。 


Mr. Hao 证 .Had 

Miss. Jiang Miss. Jiang ian 

亲爱 的 xxx 亲 有 HAO 亲 委 的 | 1 A gx 二 
(@ 初始 页 面 (b) 单 击 Mr.Hao 超 链接 (©) 单 击 MissJiang 超 链接 


3-7 二 span 二 标记 的 应 用 


3.2.11 脚本 程序 标记 和 对 象 标记 


在 HTML 网 页 中 ,除了 一 些 基本 的 文本 、 图 片 等 内 容 外 ,还 可 以 插入 脚本 程序 Java 程 
序 、 内 符 对 象 .ActiveX 控件 等 ,从 而 制作 出 更 加 新 颖 、 丰 富 和 交互 能 力 更 强 的 Web 页 面 。 
这 些 新 的 文档 内 容 需 要 通过 二 object、 过 script 记 二 applet、 二 bssound 祖 \ 二 embed 放 等 
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标记 来 进行 标记 ,下 面 介绍 其 中 的 脚本 程序 定义 标记 和 插入 对 象 标记 。 
1. 脚本 程序 定义 标记 一 script 二 … 一 /script 二 


用 户 可 以 在 HTML 文件 中 插入 脚本 程序 ,脚本 程序 分 为 客户 端 脚本 程序 和 服务 端 肢 
本 程序 两 类 。 客 户 端 脚 本 程序 一 般 为 JavaScript 程序 ,在 客户 端 浏览 器 中 解释 执行 ,可 以 在 
文件 头 和 文档 体内 书写 脚本 程序 。 服 务 端 脚本 程序 与 Web 服务 器 有 关 , 服 务 端 脚本 通常 是 
在 文档 体内 定义 。 不 同 的 Web 服务 器 应 该 对 应 不 同 的 服务 端 脚本 程序 ,因为 服务 端 脚本 程 
序 是 在 Web 服务 器 上 运行 的 。 

在 HTML 文件 中 标记 脚本 程序 的 一 般 形式 是 : 


mm 


< script language= "" runat= "" > 


脚本 程序 代码 

</script> 

属性 language 用 于 设置 脚本 程序 语言 ,runat 属性 设置 脚本 是 客户 端 还 是 服务 端 脚本 ， 
默认 为 客户 端 脚本 。 要 声明 是 服务 端 脚本 , 则 属性 值 设 为 runat 二 "Server"。 服 务 端 脚本 程 
序 也 可 以 使 用 其 他 的 标记 ,如 Tomcat 支持 的 服务 器 脚本 标记 为 二 %…% 二 标记 。 

2. 插入 对 象 标记 一 object 二 … 一 /object 二 

插入 对 象 包括 Falsh 动画 .ActiveX 组 件 或 其 他 对 象 。 在 HTML 中 插入 一 个 对 象 , 需 
要 使 用 二 object 二 … 志 /object 二 标记 来 标记 对 象 ,在 二 object 二 标记 内 ,还 需要 使 用 多 个 


去 param> 标 记 , 来 设置 该 对 象 属性 的 初始 值 , 即 为 该 对 象 传递 参数 值 。 一 般 形式 如 下 : 
过 object> 标 记 的 一 般 形 式 是 : 
< object classid = "" id= "objl"> 
< param > 
< param > 
2 
通常 情况 下 ,一 object 之 标记 以 及 每 一 个 子 标记 过 param 过 都 包含 了 许多 属性 ,插入 对 
象 的 类 型 不 同 ,这 些 参数 的 设置 悬 珠 较 大 。 对 于 各 种 类 型 对 象 的 详细 介绍 略 。 
3.2.12 ， 帧 与 浮动 帧 


帧 (Frame) 即 网 页 中 的 一 个 区 域 ,用 来 将 浏览 器 窗口 划分 为 多 个 区 域 ( 子 窗口 ) ,每 个 子 
窗口 中 装载 一 个 HTML 文件 。 即 每 个 HTML 文件 占据 一 个 帧 ,而 多 个 帧 可 以 同时 显示 在 
同一 个 浏览 器 窗口 中 ,这 样 的 Web 页 面 称 为 框架 网 页 。 

在 HTML 中 ,有 两 种 帧 技术 ,一 种 是 帧 (frame) , 另 一 种 是 浮动 帧 (iframe) 。 


1. 帧 
帧 页 定义 的 一 般 形式 是 : 


< frameset rows="" cols=""> 
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< frame name = "frame 一 name" target = "target 一 window”src= "src 一 uri"> 
< frame name = "frame - name" target = "target — window" src = "src 一 urin> 


</frameset> 


其 中 二 frameset 二 … 所 /frameset 盖 标记 定义 帧 ,必须 有 一 个 rows 属性 或 cols 属性 ,将 
屏幕 分 成 若干 行 或 若干 列 。 然 后 跟着 是 相应 的 每 一 帧 定义 ,由 过 frame> 来 标记 ,去 frame> 
为 单 标记 。 如 果 某 个 二 frame 二 进一步 进行 了 拆 分 ,在 一 frame 之 处 ,可 以 鞭 套 一 frameset 二 … 
二 /frameset 二 。 

1) 一 frameset 二 … 一 /frameset 二 标记 

二 frameset 盖 … 一 /frameset 二 标记 对 放 在 帧 的 主 文档 的 一 body 之 二 /body 二 标记 对 的 
外 边 ,也 可 以 嵌 在 其 他 帧 文档 中 ,并 且 可 以 嵌 套 使 用 。 此 标记 对 用 来 定义 主 文档 中 有 几 个 帧 
并 且 各 个 帧 是 如 何 排列 的 。 它 具有 rows 和 cols 属性 ,使 用 二 frameset 二 标记 时 这 两 个 属性 
至 少 必 须 选择 一 个 ,否则 浏览 器 只 显示 第 一 个 定义 的 帧 。 

rows 用 来 规定 主 文档 中 各 个 帧 的 行 定位 ,而 cols 用 来 规定 主 文档 中 各 个 帧 的 列 定位 。 
这 两 个 属性 的 取 值 可 以 是 百分数 、 绝 对 像素 值 或 星 号 (* * ”) ,其 中 星 号 代表 那些 未 被 说 明 的 
空间 ,如 果 同 一 个 属性 中 出 现 多 个 星 号 则 将 剩 下 的 未 被 说 明 的 空间 平均 分 配 。 同 时 ,所 有 的 
帧 按照 rows 和 cols 的 值 从 左 到 右 、 从 上 到 下 排列 。 

2) 二 frame 二 标记 

去 frame 之 标记 放 在 二 frameset 二 … 王 /frameset 过 之 间 , 用 来 定义 一 个 具体 的 帧 。 
二 frame 二 标记 具有 src 和 name 属性 ,这 两 个 属性 都 是 必须 赋值 的 。src 是 此 帧 的 源 
HTML 文件 名 (包括 网 络 路 径 , 即 相对 路 径 或 网 址 ) ,浏览 器 将 会 在 此 帧 中 显示 src 指定 的 
HTML 文件 ; name 是 此 帧 的 名 字 , 这 个 名 字 用 来 供 超 文 本 链接 标志 二 a href 一 "”target 
三 "之 中 的 target 属性 指定 链接 的 HTML 文件 将 显示 在 哪 一 个 帧 中 。 

例如 ,定义 了 一 个 帧 ,名 字 是 main, 在 帧 中 要 显示 的 HTML 文件 为 mint. htm, 则 代码 
是 二 frame name 二 "main" src 一 "mint. htm" 之 。 如 果 有 一 个 链接 ,在 单 击 了 该 链接 后 ,需要 
在 main 的 帧 中 显示 文件 newone. htm, 则 代码 为 “一 a href 王 "newone. htm" target 一 "main" 二 链 
接 的 文本 二 /a 二 ”。 这 样 一 来 ,就 可 以 在 一 个 帧 中 建立 网 站 的 目录 ,加 入 一 系列 链接 , 当 单 击 
链接 以 后 在 另 一 个 帧 中 显示 被 链接 的 HTML 文件 。 

此 外 ,二 frame 志 标记 还 有 scrolling 和 noresize 属性 ,scrolling 用 来 指定 是 否 显 示 滚 动 
条 , 取 值 可 以 是 yes( 显 示 ) .no( 不 显示 ) 或 auto( 若 需要 则 会 自动 显示 ,不 需要 则 不 显示 )。 
noresize 属性 直接 加 入 标记 中 ,不 需 赋值 , 它 用 来 禁止 用 户 调整 一 个 帧 的 大 小 。 

【 例 3-11】 设计 一 个 框架 页 面 ,要 求 框架 宽度 为 1024 ,在 宽屏 时 始终 居中 显示 。 

分 析 : 目前 由 于 显示 器 的 分 辩 率 一 般 都 大 于 等 于 1024, 因 此 ,设计 页 面 时 ,基本 上 以 
1024 作为 页 面 宽度 ,如 果 用 户 的 屏幕 是 宽屏 的 ,页 面 应 居中 显示 ,而 不 是 拉 宽 或 靠 左 。 

代码 清单 : myframe. htm 

< htm]l xmlns = "http://www. w3.org/1999/xhtml"> 

<head> 

<meta http— equiv = "Content — Type" content = "text/html; charset = gb2312" /> 


</head> 
<frameset cols ="* ,1024, * " framespacing = "0" frameborder = "0" id= "mainframes"> 
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< frame name = "free— left" scrolling = "no" noresize src="#"> 
< frameset rows = "102, * " framespacing = "0" frameborder = "0" id= "frames01"> 
< frame name = "topframe" scrolling = "no" noresize src = "mybanner. html"> 
< frameset cols= "200,10, *" id= "frames02"> 
< frame name = "leftframe" scrolling = "auto" noresize src = "menu. htm"> 
< frame name= "ctrlleft" scrolling= "no" noresize src = "scrollleft. html"> 
< frame name = "mainFrame" scrolling = "auto" noresize src = "introduction. htm"> 
</frameset > 
</frameset > 
< frame name = "free— right" scrolling = "no" noresize src="#"> 
</frameset > 
</html > 


在 myframe. htm 中 ,首先 将 屏幕 分 成 了 三 列 “* ,1024, * ”, 中 间 为 1024, 这 样 就 保证 
了 页 面 始终 显示 为 1024 宽度 。 在 中 间 的 1024 区 域 , 又 分 成 了 两 行 *102, * ”, 上 面 为 页 面 的 
banner ,下面 剩 余 高 度 为 页 面 主体 内 容 。 对 于 主体 内 容 区 ,又 分 成 了 三 列 * x 200,10,x ”。 
在 FrontPage 中 ,设计 视图 如 图 3-8 所 示 。 


yEr me. htat 
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图 3-8 框架 网 页 在 浏览 器 中 的 显示 


上 述 框架 结构 设计 可 以 应 用 于 一 般 的 Web 应 用 系统 的 功能 首页 设计 , 左 侧 为 菜单 ,中 
间 为 折 全 控制 , 右 侧 为 工作 区 。 

下 面 是 scrollleft. html 页 面 代 码 ,控制 左 侧 菜单 帧 的 折 革 。 

代码 清单 : scrollleft. html 


<html> 

<head> 

<meta http - equiv = "Content - Type" content = "text/html; charset = gb2312"> 
<base target ="_self"> 

<style> 


第 3 章 “HTML 和 XML 基础 


body{margin:0 auto; font - size:12px; text - align:center; font - family: 宋 体 ，Helvetica，sans 
— serif; background: # COCOC0;} 
</style> 
< script language = "JavaScript"> 
var tt=1; 
function ctrl] left() 
{ 
if (tt==1) 
{ 
window. parent. frames02.cols = "0,10, * "; 
lrarrow. src = "toctrlleft01.gif"; 
tt=0; 
} 
else 
| 
window. Parent. frames02. cols = "200,10, * "7 
lrarrow. src = "toctrlleft02. gif"; 
tt=1; 
} 
} 
</script > 
</head> 
<body style = "margin— left:0px;cursor:hand" onClick = "ctrl_left()"> 
<table height = "100%" width = "20" border = "0" cellspacing = "0" bordercolor = "# CCAAOO" 
bgcolor = "#cOddeb"> 
<tr> 
<tdwidth= "10" align = "center"> 
< img id= "lrarrow" src = ". . /toctrlleft02.gif"> 
</td> 
</tr> 
</table> 
</body> 
</html > 


2. 浮动 帧 
浮动 帧 是 用 过 iframe 之 标记 的 帧 ,通常 利用 表格 布局 ,在 一 个 单元 格 中 插 和 人 浮动 帧 。 一 
般 形式 是 : 


<iframe id= "frame— id" name = "frame - name" src = "page— uri" style = "height:100%; width: 
100 % ;visibility: inherit; z- index:2;"></iframe> 
使 用 浮动 帧 同样 可 以 制作 出 类 似 上 面 帧 的 效果 ,这 可 以 通过 显示 或 隐藏 所 在 单元 格 实 
现 折 靶 。 


.3 扩展 标记 语言 基础 
在 互联 网 的 发 展 历史 上 ,有 两 种 非常 核心 的 技术 一 一 Java 和 XML。Java 提供 了 程序 


代码 的 平台 无 关 性 ,而 XML 则 保证 了 数据 的 平台 无 关 性 ,已 成 为 Web 应 用 中 数据 表示 和 
数据 交换 的 标准 。 但 是 ,人 们 对 XML 的 认识 远 远 没有 对 HTML 的 认识 彻底 和 清晰 ,有 些 
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理解 甚至 是 完全 错误 的 。 那 么 ,究竟 什么 是 XML 呢 ? XML 和 HTML 有 什么 不 同 ,它们 的 
本 质 区 别 是 什么 呢 ? 同时 ,由 于 XML 毋庸 冒 疑 的 优越 性 ,XML 的 不 断 发 展 壮 大 , 挂 在 
“XML” 一 词 下 的 标准 和 规范 不 断 变 化 ,了 解 这 些 标 准 的 来 龙 去 脉 ,以 及 它们 之 间 的 关系 ,对 
于 掌握 XML 也 是 至 关 重 要 的 。 


3.3.1 XML 技术 简介 


XML 和 HTML 都 称 为 标记 语言 ,但 是 两 者 有 着 本 质 的 不 同 。HTML 是 一 种 数据 展 

示 技 术 , 它 对 内 容 加 以 标记 ,使 得 内 容 以 特定 的 方式 在 Web 浏览 器 中 显示 。 但 是 ,XML 的 

基本 动机 则 是 对 数据 结构 的 表达 ,实现 内 容 和 内 容 展 示 的 分 离 ,其 追求 的 目标 是 XML 文档 

结构 良好 以 及 内 容 的 有 效 性 约束 。 而 XML 文档 内 容 的 显示 , 则 需要 其 他 相应 的 XML 规 
范 , 例 如 XML 扩展 样式 语言 (XSL) 等 。 


1. HTML 的 不 足 


HTML 的 出 现 无 疑 是 Internet 技术 和 Web 技术 的 一 次 突破 ,为 推动 Internet 和 Web 
技术 的 发 展 发 挥 了 巨大 的 作用 。 随 着 Web 技术 的 快速 发 展 ,Internet 上 的 Web 信息 越 来 越 
多 ,内 容 越 来 越 复杂 ,数据 格式 也 越 来 越 多 ,HTML 已 经 无 法 满足 表达 日 益 丰 富 的 数据 形式 
的 需要 。 主 要 表现 在 以 下 几 个 方面 。 

(1) HTML 的 标记 固定 ,HTML 只 是 一 种 表现 技术 ,不 能 表达 语义 。 

(2) 不 能 适应 现在 越 来 越 多 的 网 络 设 备 和 应 用 的 需要 ,比如 手机 、.PDA、 信 息 家 电 都 不 
能 直接 显示 HTML。 

(3) HTML 代码 不 规范 、 脆 肿 ,浏览 器 需要 足够 智能 和 庞大 才能 够 正确 显示 HTML。 

(4) HTML 文档 中 数据 与 表现 混杂 ,页 面 要 改变 显示 ,就 必须 重新 制作 HTML。 


2. XML 的 产生 和 发 展 


HTML 的 不 足 推动 了 XML 的 产生 和 发 展 。1996 年 8 月 ,那些 关心 SGML 的 专家 聚 
集 在 美国 西雅图 ,成 立 了 一 个 名 为 GCA(Graphic Communications Association ,图 形 通 信 协 
会 ) 的 组 织 , 研 究 如 何 开 发 SGML 以 便 它 适应 和 促进 Web 技术 的 发 展 。 他 们 对 SGML 难于 
被 理解 和 实现 的 方面 进行 简化 ,去 掉 其 语法 定义 部 分 ,适当 简化 DTD 部 分 ,并 增加 了 部 分 
互联 网 的 特殊 成 分 。 为 了 体现 它 与 HTML 的 不 同 , 工 作 组 将 其 命名 为 XML, 同 时 也 将 自 
身 更 名 为 XML 工作 组 。1998 年 2 月 10 日 ,XML 工作 组 正式 向 W3C 提交 了 XML 的 最 终 
推荐 标准 ,这 就 是 XML 1.0 标准 。 

在 XML 中 ,SGML 的 最 初 动机 得 以 延续 , 那 就 是 将 文件 内 容 和 处 理 这 些 内 容 的 应 用 程 
序 进行 分 离 ,在 文件 内 容 中 不 能 入 数据 的 处 理 过 程 代 码 ,文件 内 容 被 编码 为 条 理 清 晰 的 文 
本 ,从 而 便于 数据 交换 和 处 理 。 对 数据 进行 研究 有 着 重要 的 意义 ,因为 ,数据 往往 是 相对 稳 
定 的 ,变化 的 通常 是 处 理 这 些 数 据 的 程序 。 实 现 数据 和 操作 这 些 数据 的 程序 的 分 离 是 XML 
的 设计 动机 ,这 是 深刻 理解 XML 的 基础 。 在 XML 中 ,如 果 XML 某 方面 设计 得 与 应 用 程 
序 太 过 紧密 ,就 可 以 认为 这 是 一 种 Bug, 这 是 使 用 XML 最 重要 的 一 个 原则 。 

XML 标准 的 发 展 没有 HTML 那样 迅速 ,直到 2002 年 10 月 15 日 W3C 才 发 布 了 
XML 1.1 候选 推荐 标准 。 在 XML 1. 0 规范 中 ,使 用 的 字符 集 为 Unicode 2. 0。 随 着 
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Unicode 版 本 的 升级 ,XML 1. 1 支持 新 的 Unicode 字符 ,不 再 局 限于 一 个 具体 的 Unicode 版 
本 。 此 外 ,在 XML 1.1 中 ,增加 了 IBM 大 型 主机 规定 的 换行 符 ( 井 x85: 十 六 进 制 的 85) 和 
Unicode 换行 符 ( 井 x2028) 的 处 理 能 力 , 这 些 改变 都 提高 了 XML 的 国际 化 支持 水 平 。 


3. XML 解析 器 


XML 文档 需要 在 XML 解析 器 中 才能 运行 ,XML 解析 器 是 一 个 软件 模块 ,应 用 程序 利 
用 它 来 解析 XML 文档 并 且 得 以 访问 数据 和 数据 结构 。XML 解析 器 有 确认 型 和 非 确认 型 
两 种 。 确 认 型 XML 文档 解析 器 检查 XML 文档 的 语法 ,将 XML 文档 内 容 同 文档 类 型 定义 
(DTD) 和 Schema 作 比 较 。XML 分 析 器 通过 判断 XML 数据 是 否 和 预定 义 的 确认 规则 相 
符 , 判 定 XML 文档 是 否 构造 良好 。 非 确认 型 XML 解析 器 也 进行 XML 文档 语法 的 检查 ， 
但 不 进行 XML 文档 内 容 和 DTD 及 Schema 的 比较 。 

现在 几乎 所 有 的 主流 浏览 器 都 内 置 了 XML 解析 器 ,支持 XML 和 XSLT。 例 如 ,在 微 
软 的 Internet Explorer 浏览 器 中 ,内 置 了 XML 确认 性 解析 器 MSXML。 如 果 是 一 个 有 效 
的 XML 文件 ,在 浏览 器 中 打开 XML 文件 时 ,XML 文档 将 显示 为 一 个 树 状 结构 , 称 为 XML 
文档 树 。 通 过 单 击 元 素 左 侧 的 加 号 或 减 号 ,可 以 展开 或 折 和 三 元 素 结 构 。 此 外 ,浏览 器 或 其 他 
应 用 程序 也 可 以 使 用 css 或 xslt 样式 转换 显示 XML 文档 数据 。 


4. XML 技术 分 析 


随 着 Internet 的 快速 发 展 ,尤其 是 电子 商务 、Web 服务 等 应 用 的 广泛 使 用 ,XML 类 型 
的 数据 成 为 当前 主流 的 数据 形式 。 虽 然 ,XML 作为 一 种 通用 的 数据 交换 语言 ,已 经 成 为 业 
界 的 一 种 具有 人 垄断 性 的 标准 ,在 跨 平台 、 跨 系统 数据 交换 方面 拥有 无 可 比拟 的 优势 。 但 是 ， 
和 关系 数据 库 相 比 ,XML 的 最 大 缺陷 就 是 它 的 效率 较 低 。 因 为 在 关系 型 数据 库 中 ,数据 的 
字段 名 只 需要 出 现 一 次 ,但 是 在 XML 数据 文件 中 ,元 素 名 将 反复 出 现 ,这 必然 会 影响 到 查 
询 的 效率 。 

作为 一 种 数据 存储 方案 ,XML 技术 无 疑 具有 绝对 的 优势 。 提 高 数据 的 查询 、 使 用 效率 
成 为 XML 技术 研究 的 热点 ,这 些 研究 包括 XML 与 关系 数据 库 之 间 的 相互 转换 ,利用 关系 
数据 库 的 成 熟 技 术 对 XML 数据 进行 处 理 。 为 提高 XML 的 查询 效率 ,需要 为 XML 类 型 提 
供 索 引 功能 。 如 果 对 XML 文档 不 构建 索引 结构 ,那么 针对 XML 数据 的 任何 查询 都 很 可 能 
导致 对 整个 文档 树 的 遍历 , 随 着 XML 数据 集 的 增 大 ,这 种 开销 是 不 可 忍受 的 。 

上 述 关 于 XML 研究 和 应 用 的 需求 推动 了 XML 的 发 展 , 也 导致 了 许多 新 的 XML 相关 
标准 和 规范 的 产生 ,包括 XML Schema、 扩 展 样式 语言 XSLT、XML 路 径 语言 (XPath)、 
XML 查询 语言 (XQuery)、XML 链接 语言 规范 XLink 和 XPointer 等 。 这 些 规范 都 以 XML 
语法 为 基础 ,遵守 XML 规范 ,因此 ,目前 XML 已 经 成 为 各 种 语言 规范 的 元 语言 。 


3.3.2 XML 文档 结构 


XML 文档 是 一 个 纯 文本 文件 ,XML 规范 定义 了 XML 文档 良好 的 结构 ,将 一 个 XML 
文档 分 为 XML 文档 头 部 (文档 序言 ) 和 文档 体 ( 文 档 内 容 ) 两 个 部 分 ,一 般 形 式 如 下 : 


<?xml version = "1.0" encoding = "GB 2312"?> 
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<?xml - stylesheet type = "text/xsl" href = "userxslfile.xsl"?> 
<! DOCTYPE rootElementName SYSTEM "userDTDfile. dtd"> 
<!DOCTYPE rootElementName[ 

<! ELEMENT elementname(element — defination)> 


]> 


<rootElementName> 
< elementname > ElementContent </elementname > 
< elementname > ElementContent </elementname > 


< elementname > ElementContent </elementname> 
</rootElementName > 


1. XML 文档 头 部 


XML 文档 头 部 又 称 为 文档 序言 , 它 是 指 根 元 素 之 前 的 部 分 ,XML 文档 头 部 的 作用 是 
通知 XML 解析 器 按 相关 条 件 和 限制 对 XML 文档 进行 解析 。 在 XML 文档 中 ,文档 头 部 包 
括 XML 声明 、 处 理 指令 ,文档 类 型 定义 和 注释 四 部 分 。 按 XML 规范 要 求 “ 声 明 ” 必 不 可 
少 ,并 且 作 为 文档 的 第 一 条 语句 出 现 , 其 他 部 分 根据 需要 确定 ,可 以 省 略 。 

1) XML 声明 

XML 声明 是 XML 文档 头 部 的 第 一 条 语句 ,也 是 整个 文档 的 第 一 条 语句 。XML 声明 
语句 的 格式 如 下 : 


<?xml version= "versionNumber" [encoding = "encodingValue"] [ standalone = "yes/no"] ?> 


XML 声明 语句 ,以 “二 ? xml” 开 始 ,以 “? 二 ”结束 ,表示 这 是 一 个 XML 文档 。Version 
属性 是 必 选 属性 ,表明 使 用 的 XML 规范 的 版 本 号 ,以 便 解 析 器 进行 正确 的 解析 。encoding 
属性 指定 本 XML 文档 使 用 的 字符 集 。XML 解析 器 至 少 能 够 识别 UTF-8 和 UTF-16 两 种 
编码 ,英文 用 UTF-8 编码 。 如 果 使 用 简体 汉字 ,应 设置 encoding 属性 值 为 GB 2312。 若 指 
定 繁体 汉字 赋值 为 BIG5。standalone 属性 指定 本 XML 文档 是 否 需要 外 部 的 DTD 文档 作 
为 本 文档 的 校 验 依据 , 即 本 XML 文档 是 否 为 一 个 独立 文档 。 默 认 值 是 yes, 表 示 是 独立 文 
档 不 需要 外 部 DTD 关联 ,否则 应 该 赋值 为 no。 

2) 处 理 指令 

处 理 指令 (Process Instruction,PI) 是 在 XML 文档 中 由 应 用 程序 进行 处 理 的 部 分 ， 
XML 解析 器 把 信息 传送 给 应 用 程序 ,应 用 程序 解释 指令 ,按照 它 提供 的 信息 进行 处 理 。 处 
理 指令 是 以 “< ?” 开 始 , 以 “? > 之 ”结束 ,其 格式 是 ， 


<? 处 理 指令 名 称 处 理 指令 信息 ?> 


以 “xml-[name]” 开 头 的 处 理 指令 指定 的 是 [name] 中 给 出 的 与 XML 相关 的 技术 。 处 
理 指令 以 “xml-stylesheet” 开 头 ,指明 相关 的 技术 是 样式 表 , 这 条 指令 就 被 传送 给 由 type 指 
定 的 引擎 , 而 不 传 给 XML 解析 器 。 例 如 ,二 ? xml-stylesheet type 一 "text/css”href 一 
"filel. css" ? 之 ,该 语句 中 type 表示 关联 的 文档 类 型 ,现在 的 文档 是 文本 、 层 释 样 式 表 类 型 
引擎 ,href 指定 关联 的 文档 所 在 位 置 和 文档 的 名 称 。 再 如 ,一 ? xml-stylesheet type 一 
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"text/xsl" href 一 "filel. xsl" ? 盖 , 则 关联 的 样式 文件 为 扩展 样式 表 文 件 。 以 上 是 使 用 较 频 
繁 的 两 条 指令 ,它们 规定 XML 文档 中 的 数据 使 用 哪 一 种 格式 在 浏览 器 中 显示 。 

3) 文档 类 型 定义 

如 果 XML 文档 需要 使 用 DTD 对 内 容 进 行 有 效 性 验证 , 则 需要 在 文档 头 部 增加 外 部 文 
档 类 型 定义 声明 或 进行 内 部 文档 类 型 定义 。 外 部 文档 类 型 定义 声明 , 即 声明 一 个 外 部 DTD 
文件 , 它 属 于 处 理 指令 的 范畴 。 一 般 形式 是 : 


<! DOCTYPE rootElementName SYSTEM "dtdFile "> 


在 外 部 文档 类 型 定义 后 面 将 是 内 部 文档 类 型 定义 (DTD) 部 分 ,用 于 定义 XML 中 用 到 
的 元 素 ,元 素 属性 和 实体 , 即 声 明 用 户 自 定义 标记 及 相关 属性 ,其 目的 是 用 于 确认 型 XML 
解析 器 检查 XML 文档 是 否 结构 良好 。 相 对 于 用 外 部 的 DTD 声明 ,这 里 的 文档 类 型 定义 称 
为 内 部 DTD 声明 。 其 一 般 形式 是 : 


<! DOCTYPE rootElementName [ 
<! ELEMENT element - name(element — defination)> 


]> 

其 中 , rootElementName 为 文档 的 根 元 素 , 在 根 元素 内 定义 其 他 元 素 。 例如， 
=! ELEMENT address(buildingnumber，street，city，state，zip) 二 , 则 定义 一 个 名 称 为 
address 的 元 素 , address 元 素 按 顺 序 又 包含 二 buildingnumber 二 、 二 street 二 、 二 city 二、 
< 一 state 二 、 握 zip 二 五 个 元 素 。 可 以 进一步 定义 二 buildingnumber 二 元素 为 二 ! ELEMENT 
buildingnumber( #PCDATA) 放 , 它 确定 了 二 buildingnumber 记 元 素 的 取 值 。 

在 一 个 XML 文档 中 ,内 部 文档 类 型 定义 (DTD) 部 分 不 是 必需 的 ,如 不 需要 可 以 省 略 。 

4) 注释 

XML 中 使 用 注释 对 文档 进行 解释 说 明 , 增 加 程序 的 可 读 性 ,处 理 程 序 不 对 注释 标记 的 
内 容 进行 处 理 。 与 HTML 一 样 ,注释 是 由 "二! 一" 开始, 由“-- 二 ”结束 ,注释 语句 的 格式 是 : 


<! -- 注释 文字 --> 


使 用 注释 时 需要 注意 ,第 一 ,注释 可 以 出 现在 文档 头 部 ,也 可 以 出 现在 主体 部 分 ,但 不 能 
出 现在 声明 之 前 ,声明 语句 必须 是 XML 文档 的 第 一 条 语句 ; 第 二 ,注释 可 以 包容 标记 ,使 
标记 失去 作用 ,但 注释 不 能 出 现在 标记 中 。 


2. XML 文档 内 容 


XML 文档 内 容 , 即 XML 文档 体 , 它 是 XML 文档 的 数据 部 分 。 文 档 体 包括 一 个 或 多 个 
元 素 ,每 个 元 素 由 一 个 开始 标记 和 一 个 结束 标记 定义 。 文 档 体 中 的 元 素 定义 了 数据 的 结构 ， 
一 个 单独 的 根 元 素 包 含 所 有 其 他 元 素 ,文档 中 所 有 数据 都 包含 在 文档 体 的 根 元 素 中 。 

在 文档 体内 ,还 可 以 使 用 名 称 空间 , 即 在 每 一 个 元 素 和 属性 前 面 加 上 前 缀 “名 称 空间 :” 
来 唯一 地 标识 一 个 元 素 或 一 组 元 素 的 属性 ,以 避免 多 个 XML 文档 中 的 元 素 重 名 。 

【 例 3-12】 一 个 简单 的 XML 文档 。 

下 面 是 Brion 给 Jane 的 便条 ,使 用 XML 格式 ,内 容 如 图 3-9 所 示 。 

用 html 的 思想 ,双击 该 文档 在 浏览 器 中 打开 ,显示 如 图 3-10 所 示 。 
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在 浏览 器 中 ,我 们 看 到 了 一 棵 XML 文档 树 。 这 个 XML 文档 做 了 什么 呢 ? 好 像 什 么 都 
没 做 。 我 们 需要 的 是 观念 上 的 转变 ,不 能 再 以 html 的 思想 来 理解 xml 了 。XML 不 是 
HTML 的 蔡 代 品 ,HTML 设计 的 目的 是 用 来 显示 数据 ,重点 是 显示 数据 以 及 如 何 使 数据 的 
显示 更 美观 。XML 是 用 来 存储 数据 的 ,XML 设计 的 目的 是 用 来 描述 数据 结构 ,以 及 存储 
数据 ,实现 数据 存储 和 显示 的 分 离 , 数 据 的 显示 则 是 通过 层 秋 样式 表 或 样式 转换 语言 实 
现 的 。 


局 erxa3-9.xml - 记事 本 ID| x 
文件 (E) 编辑 (E) 格式 (0) 帮助 (H) 
<?xml version="1.8" encoding="gb2312" ?> 
<note> 

<to>Brion</to> 

<from>Jane</from> 

<heading>Reminder</heading> 

<body>Don't forget me this weekend</body> 
<i/note> 


+ 省， 辐 因 人身 | 网 扫 雪 国 收 训 天 考 措 作 地 | 苔 - 汪 可 加 ” 
园 capocuments and 5ettngsWAcmnistraton 丰 而 各 材 -web 开 发 技 7 二 | 他 竺 到 | 链接 ”| 


<?xml version="1.0" encoding="gb2312" ?> 
-<note> 
<to>Brion</to> 
<from>Jane</from> 
<heading>Reminder</heading> 
<body>Don't forget me this weekend</body> 
</note> 


图 3-10 XML 文档 在 浏览 器 中 的 显示 界面 


@.4 文档 类 型 定义 


在 XML 中 ,没有 像 HTML 一 样 拥有 一 个 通用 的 标记 集合 ,标记 (在 XML 中 , 称 为 “元 
素 ”) 是 通过 文档 类 型 定义 (Document Type Difinition,DTD) 来 实现 的 。DTD 定义 了 XML 
文档 中 可 以 使 用 的 元 素 符号 .元 素 的 属性 、 元 素 的 排列 方式 /顺序 、 元 素 能 够 包含 的 内 容 等 ， 
其 目的 是 保证 确认 型 XML 解析 器 来 确定 XML 文档 数据 的 有 效 性 ,保证 XML 文档 结构 良 
好 。DTD 可 以 在 XML 文件 中 直接 定义 ,也 可 以 保存 在 一 个 完全 独立 的 文件 (. dtd) 中 。 
此 ,DTD 分 为 内 部 DTD( 在 XML 文件 中 直接 定义 DTD) 和 外 部 DTD( 在 XML 文件 中 调用 
已 经 编辑 好 的 DTD 文件 ) 两 种 。 
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3.4.1 在 DTD 中 声明 XML 元 素 


一 个 内 部 DTD 声明 必须 写 在 XML 文档 的 头 部 ,在 处 理 指令 和 XML 根 元 素 之 间 。 一 
般 形式 为 : 


<!DOCTYPE rootElementName[ 
<!ELEMENT element-name (element-definition) > 


]> 


其 中 ,一 ! DOCTYPE 表示 开始 设 定 DTD。rootElementName 指定 此 DTD 的 根 元 素 
的 名 称 ,一 个 XML 文件 只 能 有 一 个 根 元 素 。 

一 ! ELEMENT element-name (element-definition) 二 为 元 素 定义 语句 ,其 中 ， 
去 !ELEMENT 是 XML 的 保留 字 , 表 示 开 始 元 素 定义 。element-name 是 为 元 素 所 起 的 名 
称 ,element-definition 是 对 元 素 的 定义 ,就 是 说 志 元 素 二 … 二 /元素 二 之 间 能 够 包含 什么 内 
容 。 元 素 的 内 容 可 以 是 一 般 性 文字 ,也 可 以 是 其 他 元 素 。 

元 素 内 容 定 义 (element-definition) 可 以 是 : 

EMPTY | #PCDATA | 元 素 | ANY 


说 明 如 下 。 

(1) EMPTY ,没有 内 容 的 元 素 。 在 XML 文件 中 , 空 元 素 不 需要 结束 标记 ,但 必须 采用 
去 / 空 元 素 名 二 这 样 的 写法 。XML 中 的 空 元 素 类 似 于 HTML 中 的 单 标记 , 空 元 素 不 标记 
内 容 , 但 可 以 设置 元 素 属性 。 如 果 元 素 定义 为 EMPTY,EMPTY 不 需要 用 小 括号 括 起 来 ， 
即 元 素 定义 语句 可 写 为 : 


<! ELEMENT element — name EMPTY > 


(2) 井 PCDATA, 声 明 一 个 基本 元 素 , 元 素 内 容 为 可 解析 字符 数据 (parsed character 
data) , 即 元素 所 标记 的 内 容 将 被 XML 解析 器 解析 。 如 果 内 容 可 能 是 子 标记 、 实 体 等 ,它们 
一 并 被 解析 器 解析 ,从 而 得 到 正确 的 数据 关系 。 

解析 器 之 所 以 这 么 做 是 因为 XML 元 素 可 包含 其 他 元 素 。 例 如 ,定义 一 个 二 name 之 元 
素 如 下 : 二 ! ELEMENT name( 并 PCDATA) 二 , 则 对 于 下 列 的 标记 内 容 : 


<name>< first> Bill</first>< last> Gates </last ></name> 
解析 器 会 把 二 name 之 元 素 的 内 容 解析 为 下 列 的 关系 : 


<name> 
<first> Bill</first> 
< last> Gates </]1ast> 
</name> 
如 果 不 希 望 解析 器 解析 , 则 使 用 CDATA, 意 思 是 字符 数据 (character data) ,CDATA 
是 不 会 被 解析 器 解析 的 文本 ,在 这 些 文本 中 的 标签 不 会 被 当做 标记 来 对 待 ,其 中 的 实体 也 不 
会 被 展开 。 
(3) 元 素 , 声 明 一 个 容器 元 素 , 即 元 素 还 可 以 包含 另外 的 元 素 , 形 成 一 种 嵌 套 和 层次 结 
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构 。 声 明 容 器 元 素 的 基本 语法 为 : 
<! ELEMENT containerElement (containedElement, , ..., containedElement,)> 


其 中 ,containerElement 为 容器 元 素 名 称 ,containedElement, 至 containedElement, 为 
被 包含 的 元 素 。 被 包含 元 素 可 以 取 下 列 三 种 格式 之 一 。 

OO element, 要 求 该 元 素 有 且 只 有 一 个 值 。 

@ element 十 ,要求 该 元 素 有 一 个 或 多 个 值 。 

@ element * ,要 求 该 元 素 有 零 个 或 多 个 值 。 

例如 ,二 ! ELEMENT 书籍 (名称, 作者 ,价格 ) 二 ,表示 定义 了 一 个 容器 元 素 ( 即 标记 ) 
“书籍 ”, 包 含 三 个 子 元 素 ,分 别 是 “名 称 ”“ 作 者 ”和 “价格 ”。 

在 一 些 容器 元 素 的 声明 中 ,有 可 能 它 包 含 的 子 元 素 是 多 个 子 元 素 中 的 一 个 ,那么 在 声明 
此 父 元 素 时 ,就 可 以 把 它 声 明成 选择 性 元 素 , 可 供 选择 的 子 元 素 用 "| "分隔 。 例 如 : 
二 ! ELEMENT 配偶 (妻子 | 丈夫 二。 

(4) ANY, 表 明 所 有 可 能 的 元 素 以 及 可 解析 的 数据 。 

【 例 3-13】 文档 类 型 定义 DTD 举例 。 

对 于 例 3-12 中 的 文档 内 容 进 行 DTD 定义 ,XML 文档 (note. xml) 内 容 为 ， 


<?xml version= "1.0" encoding = "gb2312" ?> 


<! DOCTYPE note[ 
<! ELEMENT note (to, from, heading, body)> 
<! ELEMENT to (#PCDATA)> 


<!ELEMENT from (#PCDATA)> 
<!ELEMENT heading (#PCDATA)> 
<! ELEMENT body (#PCDATA)> 
]> 
<note> 
<to> Brion </to> 
< from > Jane </from> 
< heading > Reminder </heading> 
<body> Please give me a call tonight </body> 
</note> 


3.4.2 在 DTD 中 声明 元 素 属性 


和 HTML 标记 一 样 ,XML 元 素 往 往 也 包含 属性 。 在 XML 中 ,定义 元 素 属 性 的 一 般 形 
式 是 : 
<!ATTLIST element - name attribute — name Type Default 一 value> 


其 中 ,一 ! ATTLIST 表示 开始 属性 的 设 定 ,element-name 为 要 定义 属性 的 元 素 名 ， 
attribute-name 是 元 素 属性 名 称 ,Type 是 该 属性 属性 值 的 类 别 , 元 素 属性 值 类 型 见 表 3-13。 
Default-value 是 指 该 属性 值 的 取 值 特点 ,有 四 种 不 同 的 属性 取 值 ,分 别 是 : 
(1) # REQUIRED ,表示 在 标记 中 必须 给 定 属性 值 。 
(2) #IMPLIED, 表 示 该 属性 值 可 以 省 略 。 
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表 3-13 XML 中 元 素 属性 类 型 


类 型 名 描 述 
CDATA 表明 属性 值 可 以 是 任何 文本 字符 串 , 但 不 包括 小 于 号 (所 ) 和 西 文 双 引 号 (") ,如 
要 使 用 这 两 个 符号 可 以 使 用 实体 引用 "&lt;" 和 "&quot;" 
ENUMERATED 枚 举 该 属性 的 取 值 范围 ,一 次 只 能 有 一 个 属性 值 能 够 赋予 属性 


NMTOKEN 表示 属性 值 只 能 由 字母 .数字 .下 划 线 、: 、- 等 符号 组 成 

NMTOKENS 表示 属性 值 能 够 由 多 个 nmtoken 组 成 ,每 个 nmtoken 之 间 用 空格 隔 开 

ID 该 属性 在 XML 文件 中 是 唯一 的 

IDREF 表示 该 属性 值 是 参考 了 另 一 个 元 素 的 id 属性 

IDREFS 表示 该 属性 值 是 参考 了 多 个 其 他 元 素 的 id 属性 ,这 些 id 属性 的 值 用 空格 隔 开 

ENTITY 表示 该 属性 的 设 定 值 是 一 个 外 部 的 entity, 如 一 个 图 片 文件 

ENTITIES 该 属性 值 包含 多 个 外 部 entity, 不 同 的 entity 之 间 用 空格 隔 开 

NOTATION 属性 值 是 在 dtd 中 声明 过 的 notation( 声 明 用 什么 应 用 软件 解读 某 些 二 进 制 文 
件 ,如 图 片 文件 ) 


(3) #FIXED, 表 示 一 个 固定 的 属性 值 。 
(4) 字符 串 ,指定 属性 的 默认 取 值 。 
下 面 是 一 组 XML 元 素 和 元 素 属 性 声明 : 
<!ELEMENT FAMILY (PERSON + )> 
<! ELEMENT PERSON EMPTY > 
<! ATTLIST PERSON 
myID ID # REQUIRED 
name CDATA # REQUIRED 
sex (male| female) "male" 
nickname NMTOKENS # IMPLIED 
parentIDIDREFS # IMPLIED 


大 

上 述 XML 语句 为 元 素 PERSON 声明 了 myID .name sex,nickname 和 parentID 五 个 
属性 。myID 属性 类 别 为 ID ,表明 myID 属性 的 取 值 在 此 XML 文件 中 是 唯一 的 ,否则 将 出 
现 解析 错误 。 此 属性 设 定 中 的 属性 取 值 要 求 为 # REQUIRED, 表 示 myID 属性 在 元 素 
PERSON 中 必须 出 现 , 否 则 也 会 产生 解析 错误 。 

属性 name 为 CDATA 属性 类 别 , 表 明 属 性 取 值 为 一 般 性 文字 。 属 性 sex 的 属性 值 类 
别 是 枚 举 类 型 , 取 值 范围 为 male 或 者 female, 如 果 在 XML 文件 中 没有 为 此 属性 赋值 ,属性 
默认 取 值 是 一 个 字符 串 male。 

nickname 属性 类 型 为 NMTOKENS ,规定 了 其 取 值 的 字符 集 , 此 属性 可 以 省 略 。 属 性 
parentID 的 类 型 为 IDREFS, 表 明 该 属性 的 值 必须 在 文档 中 出 现 过 ,该 属性 可 以 省 略 。 如 果 
该 属性 的 值 没 在 文档 中 出 现 过 ,解析 器 将 认为 该 文档 为 不 规范 文档 。 

根据 上 面 的 元 素 属性 说 明 ,我 们 看 下 面 的 XML 文档 数据 : 

<FAMILY> 

<PERSON myID = "P_1" name = "Brion" nickname = "sun@# $"/> 


<PERSON myID = "P_2" name = "Jane" sex= "female"/> 
<PERSON myID = "P 3" name = "Linda" sex= "female"/> 
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< PERSON myID = "P_4" parentID = "P_ 1P 5" name= "David"/> 

</FAMILY > 

上 述 文档 数据 是 不 正确 的 ,因为 在 第 一 个 元 素 PERSON 的 nickname 属性 值 中 包含 了 
NMTOKENS 所 不 允许 的 字符 "@# $"。 此 外 ,parentID 属性 值 中 出 现 了 值 *P_5”, 但 该 值 
没有 在 文档 中 出 现 过 。 

需要 说 明 的 是 ,许多 Web 浏览 器 (例如 IE) , 仅 支 持 XML 文档 的 结构 良好 ,并 没有 数据 
内 容 的 DTD 有 效 性 验证 功能 ,因此 ,在 XML 文档 的 语法 出 错时 ,浏览 器 打开 文档 时 会 报 
错 , 但 内 容 如 果 不 符 合 DTD 定义 ,浏览 器 不 报错 。 

对 文档 的 结构 和 内 容 的 有 效 性 检查 ,可 通过 Altova XMLSpy 工具 来 完成 ,打开 XML 
文档 ,在 “XML” 菜 单 中 ,包含 “检查 良 构 性 ”和 “验证 XML” 两 条 菜单 命令 ,第 一 条 用 于 检查 
结构 是 否 良 好 ,第 二 条 则 检查 内 容 是 否 有 效 。 例 如 ,对 于 上 述 文档 , 按 F8 键 ,在 信息 输出 窗 
口 显 示 如 下 检查 结果 : 

日 国文 件 E: 教材--Yeb 技 术 导论 (第 3 版 1\family. xml 无 效 。 


担 MTOKENS 属 性 ' nickmane' 0 四 的 值 ' sung 窒 "里 的 sun8 将 ' 必须 遵循 名 称 符号 的 句法 规则 。 
[错误 位 置 : EAIILY / PERSON / Qniclnane 


3.4.3 定义 实体 


在 XML 的 DTD 中 ,还 可 以 定义 实体 (Entity)。 实 体 实际 上 起 一 种 类 似 “ 宏 "的 作用 ,一 
些 常 用 的 或 者 不 便于 直接 书写 的 文字 或 数据 ,可 以 用 一 个 标识 定义 下 来 ,在 数据 中 可 以 直接 
引用 ,这 就 是 实体 。 实 体 的 引用 通过 “&” 来 引用 ,末尾 加 “;”。 

在 XML 中 ,有 5 种 预定 义 实体 ,分 别 是 字符 “&”(&amp;) “二”(&lt;)、“ 记 ”(&.gt;)、 
“"?(&quot;) 和 *'”(&apos;)。 除 了 这 些 预定 义 实体 ,还 允许 用 户 自己 定义 实体 ,例如 ,如 
果 在 XML 文档 中 需要 频繁 使 用 词组 Good Luck, 可 以 在 DTD 中 这 样 表 示 : 二 ! ENTITY 
gl "Good Luck" 盖 。 这 样 当 使 用 Good Luck 时 ,可 以 输入 & gl; ,从 而 可 以 避免 拼 错 和 重复 
输入 相同 的 信息 ,这 里 ,gl 就 是 实体 。 

在 XML 中 ,实体 可 以 分 成 内 部 实体 、 外 部 实体 和 参数 实体 三 种 类 型 。 内 部 实体 的 一 般 
形式 为 : 


<!ENTITY entityName "will be replaced string"> 


如 果 被 蔡 换 的 文本 很 长 ,可 能 要 把 被 蔡 换 的 信息 存储 在 一 个 文件 中 。 可 以 通过 外 部 实 
体 参考 来 实现 , 即 在 实体 名 和 文件 的 URL 中 使 用 关键 字 SYSTEM ,构成 外 部 实体 。 一 般 形 
式 为 : 

<IENTITY entityName SYSTEM "URL"> 


例如 ,下 面 是 一 个 关于 实体 定义 和 引用 的 XML 文档 的 代码 : 


<?xml version= "1.0" encoding = "gb2312" ?> 
<! DOCTYPE message[ 

<! ELEMENT title ( # PCDATA)> 

<!ENTITY hi "您 好 ! "> 

<!ENTITY ans "ghi; 谢谢 ! 你 也 好 吗 ?"> 
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]> 

< message> 

<title> Jane, &hi;, &ans;</title> 

</message> 

除 此 之 外 ,在 XML 中 ,还 提供 了 参数 实体 , 它 在 实体 定义 中 通过 在 实体 名 前 插入 百 分 
号 (%) 实 现 , 百 分 号 表示 该 实体 为 参数 实体 。 一 旦 被 定义 ,参数 定义 可 以 通过 用 百 分 号 和 分 
号 包围 参数 名 来 实现 。 例 如 : 二 ! ENTITY % role"(boss | manager | employee)" 二 。 

最 后 ,我 们 要 说 明 的 是 ,对 于 定义 面向 数据 的 文法 ,DTD 的 功能 ,特别 是 有 效 性 验证 , 远 
不 如 XML Schema, 但 是 DTD 的 实体 是 XML Schema 很 难 做 的 。 在 DTD 中 很 容易 定义 实 
体 ,但 是 这 种 功能 很 难 在 XML Schema 中 再 现 。 一 般 情 况 下 ,实体 常见 于 叙述 性 文法 ,在 这 
个 领域 DTD 的 地 位 仍然 很 稳固 。 


3.4.4 字符 数据 段 


通过 预定 义 XML 实体 可 以 在 XML 文档 中 加 入 特殊 符号 ,如 果 需 要 大 量 的 特殊 符号 ， 
可 以 使 用 字符 数据 段 , 称 为 CDATA 段 。 

字符 数据 段 (CDATA 段 ) 是 指 不 被 XML 解析 器 解析 的 文本 段 , 即 使 这 些 文本 包含 了 
元 素 标记 、 实 体 引用 以 及 特殊 符号 ,它们 均 不 被 解析 器 解析 。CDATA 段 可 以 使 用 户 在 一 个 
XML 文档 中 引用 大 量 的 特殊 符号 文本 块 ,而 不 需要 分 别 以 实体 的 形式 来 代表 每 一 个 特殊 
字符 。 比 如 JavaScript 代码 ,包含 大 量 “ 二 ”或 “& ”字符 ,在 被 XML 解析 时 ,必须 使 用 预定 
义 实体 ,否则 将 发 生 错误 。 为 了 避免 错误 ,减少 麻烦 ,可 以 将 脚本 代码 定义 为 CDATA。 

CDATA 部 分 中 的 所 有 内 容 都 会 被 解析 器 忽略 ,CDATA 部 分 由 "二 ! [CDATA[" 开 
始 ,由 "]]>" 结束 ,一 般 形 式 为 : 

<! [CDATA[ 

text 
]]> 


其 中 ,text 是 包含 特殊 字符 的 文本 串 ,该 文本 不 被 XML 分 析 器 检查 。XML 处 理 器 负 
责 分 析 或 者 以 一 种 有 意义 的 方式 使 用 该 文本 块 。 其 中 的 左右 方 插 号 (*[” 和 “J]”) 不 能 省 上 略 。 
例如 ,下 面 是 一 个 包含 CDATA 的 XML 文档 : 


<?xml version = "1.0" encoding = "gb2312" ?> 
< people> 

<! [CDATA[ 

<teacher> 

<name> Li</name> 

<sex> 女 </sex> 

<age> 25 </age> 

<add> Shan Da Nan lu 27 号 </add> 
</techer > 

]]> 

</people> 


在 浏览 器 中 打开 该 文档 时 ,CDATA 段 内 的 内 容 不 被 XML 解析 器 解析 为 XML 元 素 。 
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3.4.5 声明 并 保存 外 部 DTD 文件 


如 果 和 希望 将 DTD 声明 应 用 到 其 他 XML 文件 中 ,应 该 将 DTD 文本 保存 为 一 个 独立 的 
. dtd 文件, 这样 一 个 DTD 就 可 以 被 多 个 文档 引用 ,保证 版 本 的 一 致 。 对 于 . dtd 文件 ,除了 
没有 内 部 DTD 中 的 二 ! DOCTYPE rootElement[…] 二 语句 外 ,其 他 和 一 个 XML 文件 相 
同 。 而 且 有 关 元 素数 目 、 排 列 顺序 、 空 元 素 设 定 、 选 择 性 元 素 、 属 性 设 定 、Entity 声明 等 都 和 
内 部 DTD 相同 。 

当 创建 DTD 文件 后 ,在 一 个 XML 文档 中 ,可 以 引用 外 部 DTD 中 声明 的 元 素 。 要 应 用 
一 个 外 部 DTD 文件 ,需要 在 XML 文档 的 序言 中 ,在 XML 文档 内 部 DTD 定义 和 文档 内 容 
之 前 ,添加 下 列 外 部 DTD 文件 声明 语句 : 


<! DOCTYPE rootElementName SYSTEM "dtdFile "> 


其 中 ,rootElementName 为 应 用 DTD 文件 的 XML 文档 根 元 素 ,dtdFile 为 要 引用 的 外 
部 DTD 文件 名 (. dtd) 。 

【 例 3-14】 文档 类 型 定义 DTD 举例 。 

下 面 是 描述 一 篇 学 术 论 文 的 XML 文档 ,定义 了 一 个 paper 元 素 及 相关 属性 。 


<?xml version= "1.0" encoding = "gb2312" ?> 
<! DOCTYPE paper[ 
<! ELEMENT paper (title,author + ,abstract?,contents* )> 
<! ATTLIST paper 

paperID CDATA # REQUIRED 

paperStatus (reviewing|accepted) "accepted" 
<! ELEMENT title (#PCDATA)> 
<! ELEMENT author ( # PCDRTR)> 
<! ELEMENT abstract (#PCDATA)> 
<! ELEMENT contents (#PCDATA)> 
<!ENTITY KP "knowledge points"> 
]> 
<paper paperID = "p177"> 
<title> The Research on a Kind of Knowledge Network for Self-learning </title> 
<author > XW Hao </author> 
<abstract > The self-learning is completely student-centered..</abstract > 
<contents > The idea of self-learning is based on knowledge network mainly relies on manual 
construction of &KP; ... 
</contents> 
</paper > 


上 述 代码 产生 一 个 严格 的 paper 结构 , 根 元 素 paper 声明 为 一 个 容器 元 素 ,包含 一 个 
title 元 素 、 至 少 一 个 author 元 素 一 个 可 选 的 abstract 元 素 、 零 个 或 多 个 contents 元 素 。 在 
声明 paper 元 素 后 , 紧 接 着 声明 paper 元 素 的 属性 ,为 了 便于 阅读 ,属性 的 声明 往往 直接 跟 
在 元 素 声明 的 后 面 ,虽然 这 不 是 必需 的 。 接 下 来 是 声明 一 组 基本 元 素 , 即 title、author、 
abstract 和 contents 元 素 。 最 后 定义 了 一 个 实体 KP。 


第 3 章 “HTML 和 XML 基础 


3.4.6 DTD 的 优势 和 不 足 


文档 数据 类 型 定义 (DTD) 在 保证 XML 文档 数据 的 有 效 性 方面 提供 了 一 定 的 手段 , 定 
义 DTD 有 如 下 两 个 方面 的 优点 。 

(1) 每 一 个 XML 文档 都 可 携带 一 个 DTD, 用 来 对 该 文档 格式 进行 描述 ,测试 该 文档 是 
否 有 效 的 XML 文档 。 通 过 定义 公用 外 部 DTD, 多 个 XML 文档 可 以 共享 该 DTD, 使 得 数 
据 交换 更 为 有 效 。 甚 至 在 某 些 文档 中 还 可 以 使 内 部 DTD 和 外 部 DTD 相 结 合 。 在 应 用 程 
序 中 也 可 以 用 某 个 DTD 来 检测 接收 到 的 数据 是 否 符合 某 个 标准 。 

(2) 对 于 XML 文档 而 言 , 虽 然 DTD 不 是 必需 的 ,但 它 为 文档 的 编制 带 来 了 方便 ,加 强 
了 文档 标记 内 参数 的 一 致 性 ,使 XML 语法 分 析 器 能 够 确认 文档 。 如 果 不 使 用 DTD 来 对 
XML 文档 进行 定义 ,那么 XML 语法 分 析 器 将 无 法 对 该 文档 进行 确认 。 

虽然 如 此 ,DTD 有 其 内 在 的 不 足 , 主 要 表现 在 : DTD 有 自己 的 特殊 语法 ,其 本 身 不 是 
XML 文档 ; DTD 只 提供 了 有 限 的 数据 类 型 ,用 户 无 法 自 定义 类 型 ; DTD 不 支持 域名 机 制 。 
这 些 不 足 导致 了 XML Schema 的 产生 。 但 是 ,由 于 现在 很 多 的 XML 应 用 是 建立 在 DTD 之 

上 的 ,能 读 懂 DTD 文件 以 及 在 必要 时 创建 简单 的 DTD 文件 仍然 是 很 重要 的 。 


6.5 XML Schema 及 其 应 用 


在 XML 1.0 规范 中 ,虽然 DTD 实现 了 XML 文档 中 元 素 ( 标 记 ) 及 其 类 型 的 定义 ,对 于 
XML 文档 的 结构 化 起 到 了 很 好 的 描述 作用 。 但 是 ,DTD 支持 的 数据 类 型 非常 有 限 .扩展 性 
较 差 ,没有 一 种 机 制 保证 数据 的 应 用 方 和 数据 的 服务 方 对 数据 解释 的 一 致 。 为 此 ,W3C 于 
2001 年 5 月 正式 发 布 了 XML Schema 的 推荐 标准 ,提出 了 XML 架构 (Schemay) 的 概念 , 通 
过 XML Schema 给 XML 数据 标注 数据 类 型 ,从 而 使 得 数据 的 应 用 方 可 以 通过 XML 
Schema 规范 对 所 交换 的 XML 数据 中 的 信息 进行 正确 的 解释 ,并 实现 自动 处 理 。 利 用 
XML Schema 规范 ,Web 服务 方 和 应 用 方 无 须 事先 协调 所 要 交换 的 数据 类 型 ,从 而 解决 了 
XML 文档 数据 的 结构 和 类 型 一 致 性 解析 问题 ,使 XML 文档 更 加 结构 良好 。 


3.5.1 XML Schema 的 概念 


XML Schema 是 XML 的 应 用 ,是 一 种 对 XML 文档 的 内 容 和 结构 进行 描述 和 定义 的 语 
言 。 在 XML 中 ,DTD 和 Schema 都 是 XML 文档 数据 的 约束 规则 。 和 DTD 相 比 ,Schema 
具有 以 下 优点 。DXML Schema 对 DTD 进行 了 扩充 ,引入 了 数据 类 型 .命名 空间 ,从 而 使 
其 具备 较 强 的 可 扩展 性 。DTD 提供 的 数据 类 型 只 有 CDATA、Enumerated、NMTOKEN、 
NMTOKENS 等 十 种 内 置 (built-in) 数 据 类 型 。 这 样 少 的 数据 类 型 通常 无 法 满足 文档 的 可 
理解 性 和 数据 交换 的 需要 。XML Schema 则 不 同 , 它 提供 了 更 加 丰富 的 数据 类 型 ,如 long、 
int short ,double 等 常用 的 数据 类 型 。@XML Schema 利用 Namespace 将 文档 中 特殊 的 节 
点 与 Schema 说 明 相 联系 ,一 个 XML 文档 可 以 有 多 个 对 应 的 Schema ,而 一 个 XML 文档 只 
能 有 一 个 对 应 的 DTD。@XML Schema 文档 本 身 也 是 XML 文档 ,而 不 是 像 DTD 一 样 使 
用 特殊 格式 。 开 发 人 员 可 以 使 用 相同 的 工具 来 处 理 XML Schema 和 其 他 XML 信息 ,而 不 
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必 专 门 为 Schema 使 用 特殊 工具 。 

经 过 数 年 的 大 规模 讨论 和 开发 ,如 今 XML Schema 已 经 成 为 全 球 公认 的 XML 环境 下 
首选 的 数据 建 模 工具 。 在 应 用 中 ,有 两 种 常用 的 XML Schema, 即 W3C 的 XSD Schema 
(XML Schema Definition) 和 微软 的 XDR(XMIL-Data Reduced Language)。 不 同 的 Schema 规 
范 , 虽 然 Schema 的 思想 相同 ,但 其 名 称 空间 所 提供 的 预定 义 元 素 、 内 置 数 据 类 型 不 同 。XDR 
由 微软 最 先 提出 ,并 且 经 过 修订 后 在 其 软件 中 应 用 ,所 以 XDR 被 广泛 使 用 。 目 前 支持 XDR 
Schema 的 产品 有 Microsoft Biztalk Server、Microsoft SQL Server 2000、Microsoft Office 2000、 
Microsoft IE 5.0 和 后 续 版 本 。 此 外 XDR 也 得 到 了 Extensibility 的 XML Authority 编辑 工具 
的 支持 。 但 是 ,如 果 XML 数据 具有 很 强 的 开放 性 ,如 面向 互联 网 应 用 ,要 考虑 到 对 XML 数据 
的 约束 规则 今后 可 以 被 外 部 应 用 所 兼容 ,应 尽量 选用 W3C 的 XSD Schema 规范 。 


3.5.2 XML Schema 文档 结构 


XML Schema 本 身 就 是 一 个 XML 文件 ,不 同 的 是 ,Schema 文件 所 描述 的 是 引用 它 的 
XML 文件 中 的 元 素 和 属性 的 具体 类 型 , 即 对 于 XML 文档 中 元 素 的 定义 。 一 个 XSD 文档 
就 是 一 个 命名 空间 ,可 以 被 其 他 的 XML 实例 文档 引用 。 

W3C XML Schema 是 使 用 最 为 广泛 的 XML Schema 架构 ,其 XML Schema 定义 
(XML Schema Ddefination ,XSD) 的 一 般 形 式 为 : 

<?xml version = "1.0" encoding = "gb2312"?> 

<xs:schema xmlns:xs = http://www. w3. org/2001/XMLSchema 


elementFormDefault = "qualified” 
attributeFormDefault = "unqualified"> 


. (数据 类 型 定义 ,元素 声明 、 属 性 声明 ) 


</xs:schema > 


定义 Schema 的 XML 文档 扩展 名 为 . xsd, 文 档 的 根 元 素 一 定 为 二 schema 二 ,用 于 声明 
该 XML 文档 是 一 个 XSD Schema 文档 。 元 素 二 schema 盖 包含 若干 属性 ,常用 的 属性 如 下 。 

(1) xmlns, 规 定 在 此 schema 定义 中 使 用 的 一 个 或 多 个 命名 空间 的 URI 引用 , 它 通 常 
是 W3C 规范 的 XSD Schema。 可 以 使 用 多 个 命名 空间 ,对 于 每 一 个 命名 空间 ,通常 分 配 一 
个 前 级 ( 即 名 称 空间 的 别名 ) ,以 便 引用 该 命名 空间 中 的 各 个 schema 组 件 而 不 至 于 重 名 。 

如 果 某 个 命名 空间 没有 命名 , 则 写 为 xmlns 王 "命名 空间 " ,该 空间 为 默认 命名 空间 ,使 
用 它 的 元 素 无 须 前 级 。 

(2) targetrNamespace, 设 置 该 schema 的 命名 空间 的 URI 引用 。 指 出 当 XML Schema 
实例 文档 在 引用 该 schema 时 ,xmlns 设置 的 名 称 空间 ,用 于 在 该 schema 的 XML 实例 文档 
中 使 用 该 Schema 中 的 数据 类 型 和 元 素 。 

(3) elementFormDefault ,attributeFormDefault, 可 选 。 指 出 任何 XML 实例 文档 在 使 
用 在 此 schema 中 声明 过 的 元 素 或 属性 是 否 必须 被 命名 空间 限定 。 如 果 设 置 为 unqualified 
则 使 用 该 shchema 中 的 元 素 /属性 时 ,无 须 限定 前 级 ; 如 设置 为 qualified, 则 在 使 用 该 
schema 中 的 元 素 或 属性 时 , 必须 通过 命名 空间 前 缀 限定 。 两 属性 的 默认 值 均 为 
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unqualified 。 
在 利用 XML Spy 工具 创建 W3C XML Schema 时 ,在 一 schema 二 元 素 中 ,自动 添加 一 
个 元 素 。 一 般 形式 是 : 


<xs:element name = "ENTER NAME OF ROOT ELEMENT HERE"> 
<xs:annotation> 


<xs:documentation> Comment describing your root element </xs:documentation> 
</xs:annotation> 

</xs:element > 

该 元 素 没有 实际 意义 ,只 需要 输入 一 个 根 元 素 的 名 字 , 它 将 在 使 用 该 架构 的 XML 实例 
文档 中 作为 XML 文档 的 根来 使 用 。 如 果 一 个 架构 应 用 于 多 个 不 同 的 XML 实例 文档 ,可 以 
在 架构 中 定义 多 个 这 样 的 根 元 素 , 供 不 同 的 XML 文档 使 用 。 接 下 来 用 户 可 以 定义 简单 数 
据 类 型 定义 ,复杂 数据 类 型 定义 .元 素 和 属性 声明 、 属 性 组 定义 等 ,这 些 定义 或 声明 ,就 构成 
了 一 个 用 户 的 XSD Schema, 然 后 用 户 在 自己 的 XML 实例 文档 中 就 可 以 引用 这 个 schema 
了 ,来 确保 XML 文档 的 有 效 性 。 


3.5.3 XSD 内 置 元 素 与 数据 类 型 


在 W3C XML Schema 规范 中 ,预定 义 了 大 量 的 XML 元 素 和 数据 类 型 ,供用 户 定义 自己 的 
schema 时 使 用 。 这 类 似 于 程序 设计 语言 中 的 关键 字 和 标准 函数 。 要 设计 自己 的 schema, 必 须 
了 解 这 些 内 置 的 元 素 和 类 型 ,否则 将 无 法 完成 schema 中 数据 类 型 和 元 素 的 定义 。 

1. XSD 预定 义 元 素 

在 W3C XML Schema 文档 中 ,我 们 已 经 看 到 了 一 xs:schema 二 元 素 和 二 xs:elment 二 元 
素 , 这 就 是 在 命名 空间 http://www. w3. org/2001/XML Schema 中 定义 的 元 素 , 称 为 预定 


义 元 素 , 这 些 预 定义 元 素 是 我 们 设计 自己 schema 的 基础 。 
W3C XML Schema 规范 定义 了 大 量 的 元 素 和 数据 类 型 ,常用 的 预定 义 元 素 见 表 3-14。 


表 3-14 W3C XML Schema(XSD) 预 定义 元 素 


元 素 名 说 明 主要 属性 内 容 父 元 素 
include import redefine、 
id、xmlns、 notation ,annotation、 
ee 定义 schema 的 根 |elementFormDefault、| simpleType、 
元 素 attributeFormDefault, |complexType、 element、 
targetNamespace attribute .group、 
attributeGroup 
向 一 个 文档 添加 带 有 |id、 
import 不 同 目标 命名 空间 的 |namespace、 annotation schema 
多 个 schema schemaLocation 
向 一 个 文档 添加 带 有 
include 相同 目标 命名 空间 的 |id、schemaLocation annotation schema 
多 个 schema 
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续 表 
元 素 名 说 明 主要 属性 内 容 父 元 素 
在 当前 schema 中 重 pe 
redefine 新 定义 从 外 部 架构 广 id、schemaLocation complexType、group、 schema 
件 中 获取 的 简单 和 复 > 
杂 类 型 .组 和 属性 组 attributeGroup\annotation 
描述 XML 文档 中 非 id、name、public、 . 
notation XML 数据 格式 ta annotation schema 
annotation 标记 schema 注释 id appinfo、documentation “| 任何 元 素 
规定 annotation 元 素 
appInfo 中 应 用 程序 要 使 用 的 | source 人 We annotation 
信息 
documentation 0 昌 的 这 Source\、xml:lang 人 生 区 下 策略 20 annotation 
定义 一 个 简单 类 型 ， schema、 
规定 与 具有 纯 文本 内 . re element 、 
simpleType 容 的 元 素 或 属性 的 值 |id name ee attribute、 list、 
有 关 的 信息 以 及 对 它 Testriction 、 
们 的 约束 union 
minExclusive、 
minInclusive、 
定义 对 simpleType、 maxExclusive、 
a simpleContent、 maxlInclusive ,totalDigits 、 impleType, 
restriction id base simpleContent 、 
complexContent 的 fractionDigits \length、 
约束 minLength .maxLength、 nln 
enumeration 、 
whiteSpace .pattern 
把 简单 类 型 定义 为 指 
list 定数 据 类 型 的 值 的 一 |id\itemType annotation simpleType simpleType 
个 列表 
union | id memberTypes annotation simpleType simpleType 
annotation 、 
simpleContent、 
. complexContent .group、 | schema、 
complexType | 定义 复杂 类 型 id、 Nome, abetract “|all\choice, sequence、 element、 
mixed block final 
attribute、 redefine 
attributeGroup、 
anyAttribute 
complexType、 
规定 子 元 素 能 够 以 任 group、 
all 意 顺 序 出 现 ,每 个 子 |id、 lee restriction 、 
元 素 可 出 现 零 次 或 |minOccurs、maxOccurs simpleContent、 


一 次 


complexContent、 


extension 
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续 表 
元 素 名 说 明 主要 属性 内 容 父 元 素 
complexType、 
choice、 
要 求 子 元 素 必须 按 顺 sequence、 
序 出 现 ,每 个 子 元 素 |id、 Ce Cn 
和 可 出 现 0 到 任意 |minOccurs、maxOccurs Epo restriction 、 

次 数 人 simpleContent 、 
complexContent、 
extension 
complexType、 
group、 choice、 

仅 允 许 在 二 choice 二 | . annotation ,element 、 sequence、 

choice 声明 中 包含 一 个 元 素 > group\choice、 restriction、 
= minOccurs .maxOccurs 

出 现在 包含 元 素 中 sequence \any simpleContent 、 
complexContent、 
extension 

对 complexType 元 . 

simpleContent | 素 的 扩展 或 限制 且 不 |id any attributes i complexType 
包含 任何 元 素 restriction .extension 

定义 对 复杂 类 型 ( 包 |. restriction、 

complexContent| 含混 合 内 容 或 仅 包含 有 oe simpleContent、 complexType 
元 素 ) 的 扩展 或 限制 py tttbeges extension ,annotation 
annotation ,group ,all 、 
扩展 已 有 的 choice、sequence、 . 
extension simpleType 或 id base、xml:lang attribute 、 了 PRE 
complexType 元 素 attributeGroup、 complexContent 
anyAttribute 
在 复杂 类 型 设计 中 |id、 
一 any> 意味 着 在 |minOccurs、 
any XML 实例 文档 中 ,可 |maxOccurs、 annotation 人 

以 被 任意 数量 的 元 素 |namespace choice sequence 

扩展 processContents 

在 复杂 类 型 中 扩展 属 让 

性 , 即 在 元 素 中 可 以 |14、 ny 

anyAttribute ”| 使 用 没有 声明 的 属 | namespace、 annotation Sp le antenb 

性 。 但 这 个 属性 应 该 | processContents complexConteat 

用 一 attribute 二 声明 RS 
extension 

id、name、type、ref、 
default、 fixed、 form,| . 
Pe 定义 元 素 a simpleType RE lpe 、| schema .all、 
key、keyref unique sequence choice 
minOccurs、 abstract、 


block final 
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续 表 
元 素 名 说 明 主要 属性 内 容 父 元 素 
schema、 
complexType、 
id、name、type、ref、 attributeGroup 、 
attribute 定义 一 个 属性 default、fixed、form 、| annotation simpleType restriction 、 
use any attributes simpleContent 、 
complexContent、 
extension 
schema 、choice、 
sequence、 
定义 在 复杂 类 型 定义 |id、name、ref、 annotation .all、 complexType、 
中 使 用 的 元 素 组 minOccurs .maxOccurs| choice sequence restriction 、 
complexContent、 
extension 
schema、 
attributeGroup 、 
二 annotation ,attribute、 complexType、 
attributeGroup 定义 在 香雪 并 型 定义 id name ref attributeGroup 、 restriction 、 
中 使 用 的 属性 组 
anyAttribute simpleContent 、 
complexContent、 
extension 
指定 属性 或 元 素 值 
key (或 一 组 值 ) 必 须 是 指 |id name annotation selector ,field | element 
定 范围 内 的 键 
规定 属性 或 元 素 值 
keyref (或 一 组 什 ) 对 应 指 定 id ,name ,refer annotation \selector field |element 
的 key 或 unique 元 
素 的 值 
指定 属性 或 元 素 值 
unique (或 者 属性 或 元 过 信 id ,name annotation ,field ,selector |element 
的 组 合 ) 在 指定 范 
内 必须 是 唯一 的 
规定 XPath 表达 式 ， 
该 表达 式 指定 用 来 定 
field 义 标识 约束 (unique、 |id、XPath、xml:lang |annotation ele 
key 和 keyref 元 素 ) 
的 值 
指定 XML 路 径 语言 
(XPath) 表达 式 ,该 本 
selector 表达 式 为 标识 约束 选 |id、XPath annotation . 
keyref .unique 


择 一 组 元 素 (unique、 
key 和 keyref 元 素 ) 
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在 表 3-14 中 ,我 们 只 是 列 出 了 每 个 元 素 的 属性 ,因为 本 书 篇 幅 的 限制 ,对 于 属性 的 功 
能 、 取 值 没有 详细 给 出 ,需要 时 可 以 从 网 上 搜索 或 查看 相应 的 手册 。 

为 了 更 精细 地 定义 数据 的 取 值 范围 和 取 值 模式 ,在 XSD 中 还 定义 了 一 组 内 容 取 值 约束 
及 限定 元 素 , 来 更 精确 地 限定 元 素 的 取 值 。XSD 定义 的 标准 取 值 约束 限定 (Restrictions/ 
Facets) 元 素 名 称 见 表 3-15 。 


表 3-15 XSD 数据 类 型 内 容 取 值 约束 元 素 


元 素 名 


说 有 明 


minExclusive 
minInclusive 
maxExclusive 
maxlInclusive 
length 
minLength 
maxLength 
enumeration 
totalDigits 


pattern 


内 容 值 范围 最 小 ,但 不 包含 此 值 , 即 二 
内 容 值 范围 最 小 , 且 包含 此 值 , 即 一 一 
内 容 值 范围 最 大 ,但 不 包含 此 值 , 即 二 
内 容 值 范围 最 大 , 且 包 含 此 值 , 即 二 = 
元 素 内 容 的 长 度 

元 素 内 容 的 最 小 长 度 

元 素 内 容 的 最 大 长 度 

元 素 内 容 为 此 元 素 中 选 一 的 列表 
指定 最 大 数字 的 位 数 

正则 语言 的 元 素 内 容 


通过 对 数据 类 型 设置 内 容 约束 ,可 以 使 数据 的 有 效 性 设置 更 加 准确 。 
2. XSD 内 置 数据 类 型 


在 W3C XML Schema 规范 中 ,给 出 了 大 量 的 标准 数据 类 型 ,分 为 字符 串 数据 类 型 、 数 


值 型 数据 类 型 .日 期 时 间 型 数据 类 型 ,以 及 Boolean、 进 制 等 杂项 数据 类 型 。 
1) 字符 串 相 关 数 据 类 型 
在 XSD 中 ,对 于 字符 串 数 据 , 进 行 了 更 加 精细 化 的 类 型 划分 ,相关 类 型 见 表 3-16。 


类 型 名 


表 3-16 字符 串 相关 数据 类 型 
说 明 


string 


normalizedString 


Token 


Name 


NCName 


QName 


NMTOKEN 


字符 串 , 以 下 的 数据 类 型 均 衍 生 于 字符 串 数据 类 型 

规格 化 字符 串 数据 类 型 ,不 包含 换行 符 (\10) 、 回 车 (\13") 或 制 表 符 (\9") 的 字符 串 ， 
XML 处 理 器 会 移 除 换行 、 回 车 以 及 制 表 符 , 相 邻 的 空格 字符 将 会 被 合并 为 一 个 空格 
字符 ,第 一 个 和 最 后 空格 将 被 移 走 

不 包含 换行 符 、 回 车 或 制 表 符 .开头 或 结尾 空格 或 者 多 个 连续 空格 的 字符 串 。 如 果 存 
在 ,XML 处 理 器 会 将 它们 去 除 ,中 间 的 多 个 空格 合并 为 1 个 空格 

Token 的 衍生 类 型 ,包含 合法 XML 名 称 的 字符 串 ,XML 名 称 的 第 一 个 字母 必须 是 
字母 下划线 (_) 或 表意 字符 

Name 的 衍生 类 型 ,不 包含 冒号 (:) 的 XML 名 称 。NCName 以 字母 或 下 划 线 (_) 字 
符 开头 ,后 接 XML 规范 中 允许 的 任意 字母 .数字 、 重 音字 符 、 变 音符 号 .句点 (. )、 连 
字符 (-) 和 下 划 线 (_) 的 组 合 

限定 名 (qualified name) ,由 名 字 空 间 (namespace) ,前 级 (prefix) ,冒号 (:) 和 一 个 元 素 
名 称 构成 

NCName 的 衍生 类 型 ,类似 XML 名 称 ,但 允许 所 有 的 字符 作为 名 称 的 开始 字符 
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续 表 
类 型 名 说 明 
NMTOKENS 值 为 合法 的 XML 名称 的 列表 ,包含 一 个 或 多 个 用 空白 分 隔 的 XML 名 称 记号 
ID 值 为 唯一 的 id 
IDREF 值 为 另外 一 个 元 素 的 id 
IDREFS 包含 合法 的 语言 id 的 字符 串 , 值 为 其 他 id 的 列表 
ENTITY 值 是 一 个 实体 


ENTITIES 值 是 一 个 实体 列表 


对 于 字符 串 数 据 类 型 ,可 以 附加 的 类 型 的 限定 (Restriction) 有 enumeration length、 
maxLength、minLength、whiteSpace 和 pattern (NMTOKENS IDREFS 以 及 ENTITIES 
无 法 使 用 此 约 东 ) 。 

2) 数值 型 数据 类 型 

在 XSD 中 , 表 3-17 中 所 有 的 数据 类 型 均 源 自 十 进 制 数据 类 型 。 


表 3-17 数值 型 数据 类 型 列表 


类 型 名 说 明 
decimal 十 进 制 数字 ,小 数 或 整数 
byte 有 正 负 的 8 位 整数 (一 128 一 127) 
unsignedByte 无 正 负 的 8 位 整数 (0 一 2 一 1, 即 0 一 255) 
integer 整数 值 
positiveInteger 仅 包 含 正 值 的 整数 (1 一 232 一 1) 
nonPositiveInteger 仅 包 含 非 正 值 的 整数 (一 232 一 ,一 2,， 一 1, 0) 
negativeInteger 仅 包含 负 值 的 整数 (一 22 一 ,一 2, 一 1) 
nonNegativeInteger 仅 包含 非 负 值 的 整数 (0, 1, 2, 一 22 一 1) 
int 有 正 负 的 32 位 整数 (一 ?2 一 22 一 1) 
unsignedInt 无 正 负 的 32 位 整数 (0 一 222 一 1) 
short 有 正 负 的 16 位 整数 (一 25 一 25 一 1) 
unsignedShort 无 正 负 的 16 位 整数 (0 一 25 一 1) 
long 有 正 负 的 64 位 整数 (一 2 一 2% 一 1) 
unsignedLong 无 正 负 的 64 位 整数 (0~2% 一 1) 


在 计算 机 中 ,整数 类 型 数据 采用 补 码 表示 法 , 正 数 的 补 码 等 于 数值 本 身 ,负数 的 补 码 为 
其 绝对 值 的 原 码 取 反 十 1。 对 于 一 个 位 2 进 制 整数 ,通常 是 最 高 位 为 符号 位 ,0 代表 正 数 ， 
1 代表 负数 ,其 余 的 n 一 1 位 为 数值 位 。 因 此 ,一 个 位 有 符号 的 整数 ,可 存储 的 最 大 数 的 最 
高 位 为 0( 代 表 正 数 ) ,其 余 一 1 位 全 为 1, 表示 的 十 进 制 数 为 2 一 一 1; 可 存储 的 最 小 数 的 最 高 
位 为 1( 代 表 负 数 ) ,其 余 一 1 位 全 为 0, 表 示 的 十 进 制 数 为 一 2" 一 1。 对 于 无 符号 数 ,其 最 高 位 
不 再 是 符号 位 ,也 表示 数值 ,因此 ,最 大 的 数 为 所 有 位 均 为 1, 其 取 值 范围 是 0~2" 一 1。 

可 与 数值 数据 类 型 一 同 使 用 的 限定 为 enumeration fractionDigits、maxExclusive、 
maxlInclusive .minExclusive .minInclusive ,pattern,totalDigits .whiteSpace。 

3) 日 期 时 间 型 数据 类 型 

在 XSD 中 ,日 期 时 间 型 数据 类 型 见 表 3-18。 
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表 3-18 日 期 时 间 型 数据 类 型 


类 型 


说 有明 


date 
time 


dateTime 


gDay 
gMonth 
gMonthDay 
gYear 
gYearMonth 


duration 


定义 一 个 日 期 值 ,格式 为 yyyy-mm-dd 

定义 一 个 时 间 值 ,格式 为 hh:mm:ss 

定义 一 个 日 期 和 时 间 值 ,字符 串 的 格式 为 : yyyy-mm-ddTHH:MM :SS 
例如 : 2007-03-11T11:09:05, 其 中 的 工 为 日 期 和 时 间 的 分 割 符 
定义 日 期 的 天 DD) 

定义 日 期 的 月 MM) 

定义 日 期 的 月 和 天 (MM-DD) 

定义 日 期 的 年 (YYYY) 

定义 日 期 的 年 和 月 (YYYY-MM) 

定义 一 个 时 间 间 隔 


可 附加 的 内 容 约 束 有 minInclusive、maxInclusive、minExclusive、maxExclusive、 whiteSpace、 


enumeration、pattern。 
4) 杂项 数据 类 型 
在 XSD 中 ,杂项 数据 类 型 见 表 3-19。 


表 3-19 杂项 数据 类 型 


类 型 名 说 明 
boolean 规定 true 或 false 值 。 合 法 的 布尔 值 是 true、false、1( 表 示 true) 以 及 0( 表 示 false) 
anyURI 用 于 规定 URI, 假如 某 个 URI 含有 空格 ,用 %20 替换 
base64Binary 表达 Base64 编码 的 二 进 制 数据 
hexBinary 十 六 进 制 编码 的 二 进 制 数据 
float 单 精 度 32 位 浮 点 数 
double 双 精 度 64 位 浮 点 数 
NOTATION 描述 XML 文档 中 非 XML 数据 格式 


可 与 杂项 数据 类 型 一 同 使 用 的 限定 为 enumeration (布尔 数据 类 型 无 法 使 用 此 约束 )、 
length (布尔 数据 类 型 无 法 使 用 此 约束 ) .maxLength (布尔 数据 类 型 无 法 使 用 此 约束 )、 
minLength (布尔 数据 类 型 无 法 使 用 此 约束 ) 、whiteSpace、pattern。 


3.5.4 数据 类 型 定义 


元 素 分 为 简单 类 型 元 素 和 复杂 类 型 元 素 两 种 ,简单 类 型 元 素 的 值 不 能 包含 元 素 或 属性 ， 
复杂 类 型 元 素 可 以 产生 在 其 他 元 素 中 典 套 元 素 的 效果 ,或 者 为 元 素 增加 属性 。 无 论 是 MS 
XML Schema 还 是 W3C 的 XML Schema 规范 , 均 包 含 一 组 预定 义 的 数据 类 型 , 除 此 之 外 ， 
还 允许 用 户 自 定义 元 素数 据 类 型 。 

在 XML Schema 中 ,数据 类 型 的 定义 有 两 种 方式 ,一 种 是 单独 地 定义 数据 类 型 ,并 为 类 
型 命名 ; 另 一 种 是 将 数据 类 型 定义 写 在 元 素 声 明 中 。 两 种 方式 各 有 特点 ,应 根据 实际 情况 
而 定 ,如 果 一 个 数据 类 型 只 在 一 个 元 素 中 使 用 ,在 元 素 声明 时 定义 类 型 更 加 简单 。 


1. 简单 类 型 及 其 定义 
简单 类 型 元 素 是 不 含 属 性 或 其 他 元 素 的 元 素 。 在 W3C XML Schema 规范 中 ,已 经 预 
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定义 了 大 量 的 简单 类 型 , 除 此 之 外 ,还 允许 用 户 自己 定义 简单 数据 类 型 。 用 户 自 定义 简单 类 
型 的 一 般 形式 是 : 


<xs:simpleType name = "name"> 
< xs:restriction base = "xs:datatypes"> 
<xs:facets_element value = "value"/> 


</xs:restriction> 
</xs:simpleType> 


在 上 述 的 简单 数据 类 型 定义 中 ,一 xs:simpleType 二 元 素 的 name 属性 给 出 类 型 名 ， 
二 restriction 祖 元素 base 属性 设置 基础 数据 类 型 ,如 string float double 和 decimal 等 ,也 
可 以 是 用 户 定 义 的 简单 数据 类 型 。 除 此 之 外 ,restriction 元 素 的 子 元 素 facets_element 是 描 
述 数 据 类 型 的 细节 规则 , 即 元 素 内 容 取 值 的 精确 约束 ,比如 长 度 、 范 围 等 , 见 表 3-15。 

【 例 3-15】 定义 一 个 简单 数据 类 型 age, 要求 为 18 一 65 岁 的 整数 。 

分 析 : 该 类 型 不 仅 要 说 明基 本 类 型 ,还 需要 给 出 类 型 的 取 值 范围 ,这 可 通过 内 容 约 东 元 
素来 设 定 。 类 型 定义 如 下 : 


<xs:simpleType name = "age"> 
<xs:restriction base = "xs:integer"> 
<xs:minInclusive value = "18"/> 
<xs:maxInclusive value = "65"/> 
</xs:restriction> 
</xs:simpleType> 


【 例 3-16】 利用 上 面 定义 的 age 类 型 ,定义 一 个 年 龄 在 18 一 25 岁 的 青年 数据 类 型 。 
类 型 定义 如 下 : 


<xs:simpleType name = "young"> 
<xs:restriction base= "age "> 
<xs:minInclusive value= "18"/> 
< xs:maxInclusive value= "25"/> 
</xs:restriction> 
</xs:simpleType > 


【 例 3-17】 定义 枚 举 数据 类 型 colorType。 
类 型 定义 如 下 : 


<xs:simpleType name = "colorTYpe"> 
<xs:restriction base = "xs:string"> 
<xs:enumeration value = "red"/> 
<xs:enumeration value = "white"/> 
<xs:enumeration value = "blue"/> 
<xs:enumeration value = "black"/> 
</xs:restriction> 
</xs:simpleType> 


【 例 3-18】 定义 数值 型 数据 类 型 ,并 约束 取 值 的 格式 。 
类 型 定义 如 下 : 
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<xs:simpleType name = "productCode"> 
<xs:restriction base = "xs:string"> 
<xs:length value = "6" fixed = "true"/> 
</xs:restriction> 
</xs:simpleType> 


还 可 以 用 pattern 字符 串 设置 正则 语言 模板 字符 串 : 


<xs:simpleType name = "productCode"> 
<xs:restriction base = "xs:string"> 
<xs:pattern value= "\d{2} —- \d{3} - \d{7}"/> 
</xs:restriction> 
</xs:simpleType> 


2. 复杂 类 型 及 其 定义 


在 XML Schema 中 ,一 个 元 素 如 果 包 含 属性 或 别 的 元 素 , 这 样 的 元 素 为 复杂 类 型 元 素 。 
复杂 类 型 元 素 又 称 为 容器 元 素 , 声 明 一 个 复杂 类 型 元 素 需 要 定义 复杂 类 型 。 在 W3C XML 
Schema 中 ,复杂 类 型 的 定义 的 一 般 形式 为 : 

<xs:complexType name = "name" mixed = "false|true"> 

<xs: 子 元 素 指示 器 > 


<xs:element name = "element - name" type = "element - type"/> 
<xs:element name = "element - name" type = "element - type" /> 


</xs: 子 元 素 指 示 器 > 
</xs:complexType > 
其 中 ,name 属性 表示 数据 类 型 的 名 称 ,mixed 属性 说 明 此 元 素 是 否 标记 内 容 , 默 认 值 为 
false, 表 示 只 声明 XML 元 素 。 当 mixed 的 值 为 true 时 ,表示 声明 XML 元 素 所 标记 的 内 容 
中 ,除了 XML 元 素 外 ,还 包含 文字 内 容 , 参 见 例 3-23。 
子 元 属 类 型 指示 器 给 出 了 子 元 素 之 间 在 容器 中 的 关系 ,说 明 见 表 3-20。 


表 3-20 ”XSD 指示 器 元 素 及 功能 


指示 器 分 类 指示 器 元 素 说 有明 
规定 子 元 素 可 以 按照 任意 顺序 出 现 , 且 每 个 子 元 素 必须 
cal 只 出 现 一 次 。 当 使 用 二 all>> 指示 器 时 ,可 以 把 
Order 指示 器 用 于 定 二 minOccurs 志 设置 为 0 或 者 1, 而 只 能 把 二 maxOccurs 二 
义 元 素 的 顺序 指示 器 设置 为 1 
<choice> 规定 可 出 现 某 个 子 元 素 或 者 可 出 现 另外 一 个 子 元 素 
<sequence> 规定 子 元 素 必须 按照 特定 的 顺序 出 现 
Occurrence 指示 器 ER 规定 某 个 元 素 可 出 现 的 最 大 次 数 ,如 需 使 某 个 元 素 的 出 
用 于 定义 元 素 出 现 现 次 数 不 受 限制 ,使 用 maxOccurs 二 "unbounded" 
的 频率 <minOccurs> 规定 某 个 元 素 能 够 出 现 的 最 小 次 数 
Group 指示 器 用 于 | 二 Group> 元 素 组 
定义 相关 元 素 过 attributeGroup ”| 属性 组 
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续 表 
指示 器 分 类 指示 器 元 素 说 明 
Content 指示 器 用 于 | 二 simpleContent>> | 没有 XML 元 素 ,只 有 属性 、 内 容 或 simpleType 内 容 
指定 数据 内 容 过 complexContent>> | 只 拥有 XML 元 素 或 空 元 素 


【 例 3-19】 定义 复杂 数据 类 型 person, 包 含 姓名 、 性 别 、 出 生日 期 。 然 后 扩展 person 类 
型 ,定义 一 个 新 的 数据 类 型 personinfo, 包 含 地 址 等 信息 。 
类 型 定义 如 下 : 


<xs:complexType name = "person"> 
<xs:sequence> 
<xs:element name = "name" type = "xs:string"/> 
<xs:element name = "sex"> 
<xs:simpleType> 
<xs:restriction base = "xs:string"> 
< xs:pattern value = "male| female"/> 
</xs:restriction> 
</xs:simpleType> 
</xs:element > 
<xs:element name = "birthday" type = "xs:date"/> 
</xs:sequence> 
</xs:complexType > 
<xs:complexType name = "personinfo"> 
<xs:complexContent > 
<xs:extension base = "person"> 
<xs:sequence> 
<xs:element name = "address" type= "xs:string"/> 
<xs:element name = "city" type = "xs:string"/> 
</xs:sequence> 
</xs:extension> 
</xs:complexContent > 
</xs:complexType> 


在 对 数据 类 型 进步 扩展 时 ,二 extension 二 元 素 不 能 直接 在 二 complexType 二 元 素 内 , 必 
须 通过 二 complexContent 记 元 素 。 此 外 ,对 于 一 个 复杂 数据 类 型 ,还 可 以 在 最 后 一 个 元 素 的 
后 面 添加 过 xs:any minOccurs 王 "0"/ 盖 来 进行 扩展 。 但 是 ,此 时 ,该 类 型 将 不 能 设置 为 
一 extension 二 元素 的 base 属性 。 

【 例 3-20】 元 素 组 的 定义 及 应 用 。 

示例 代码 如 下 : 


< xs:group name = "persongroup"> 
< xs:sequence> 
< xs:element name = "name" type = "xs:string"/> 
<xs:element name = "sex" type= "xs:string"/> 
<xs:element name = "birthday”type= "xs:date"/> 
</xs:sequence> 
</xs:group> 
<xs:complexType name = "personinfo"> 
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< xs:sequence> 
<xs:group ref = "persongroup"/> 
<xs:element name = "address" type= "xs:string"/> 
<xs:element name = "city" type = "xs:string"/> 
</xs:sequence> 
</xs:complexType > 
<xs:element name = "person" type = "personinfo"/> 


3.5.5 声明 元 素 


声明 元 素 就 是 定义 元 素 的 名 字 和 内 容 模 型 。 在 XML Schema 中 ,元素 的 内 容 模型 由 其 
类 型 定义 ,定义 一 个 元 素 , 即 声明 一 个 元 素 名 称 及 给 定 该 元 素 的 取 值 类 型 ,在 XML 文档 中 
实例 元 素 的 值 必 须 符合 模式 中 定义 的 类 型 。 

在 XML Schema 中 ,定义 XML 元素 的 一 般 形 式 是 : 


<xs:element name = "elementname" type = "datatype" default = "value" fixed= "value" /> 


其 中 ,elementname 为 要 定义 的 元 素 的 元 素 名 ,datatype 声明 该 元 素 取 值 的 数据 类 型 ， 
数据 类 型 分 为 简单 类 型 和 复合 类 型 两 种 ,简单 类 型 元 素 的 值 不 能 包含 元 素 或 属性 ,复合 类 型 
元 素 可 以 产生 在 其 他 元 素 中 嵌 套 元 素 的 效果 ,或 者 为 元 素 增加 属性 。default 属性 给 定 默认 
值 ,fixed 属性 指定 固定 值 。 

除了 上 述 通过 元 素 类 型 声明 一 个 元 素 外 ,还 可 以 将 数据 类 型 的 定义 和 元 素 的 声明 进行 
合并 ,来 声明 一 个 元 素 。 一 般 形式 是 : 


<xs:element name = "elementname"> 
元 素数 据 类 型 定义 


</xs:element > 


【 例 3-21】 用 两 种 不 同形 式 声明 一 个 元 素 一 car> ,元 素 内 容 为 Audi,.BWM 或 Buick。 
示例 代码 如 下 。 
形式 一 : 


< xs:element name = "car" type = "carType" /> 
<xs:simpleType name = "carTYpe"> 
<xs:restriction base = "xs:string"> 
< xs:enumeration value= "Audi"/> 
<xs:enumeration value = "Buick"/> 
<xs:enumeration value = "BMW"/> 
</xs:restriction> 
</xs:simpleType > 


形式 二 : 


<xs:element name = "car"> 
<xs:simpleType> 
<xs:restriction base = "xs:string"> 
<xs:enumeration value = "Audi"/> 
<xs:enumeration value = " Buick"/> 
<xs:enumeration value = "BMW"/> 
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</xs:restriction> 
</xs:simpleType> 
</xs:element > 


【 例 3-22】 声明 一 个 元 素 志 password 二 ,其 取 值 为 6 一 8 个 字母 .数字 字符 构成 的 字 
符 串 。 
示例 代码 如 下 : 


<xs:element name = "password"> 
< xs:simpleType> 
<xs:restriction base = "xs:string"> 
< xs:minLength value= "5"/> 
< xs:maxLength value = "8"/> 
<xs:pattern value = "[a-zA-20-9]{6,8}"/> 
</xs:restriction> 
</xs:simpleType> 
</xs:element > 


【 例 3-23】 复合 复杂 数据 类 型 的 定义 及 应 用 举例 。 
类 型 定义 如 下 : 


<xs:element name = "letter" type = "lettertype"/> 
<xs:complexType name = "lettertype" mixed= "true"> 
<xs:sequence> 
<xs:element name = "name" type = "xs:string"/> 
<xs:element name = "orderid" type = "xs:positiveInteger"/> 
<xs:element name = "shipdate" type = "xs:date"/> 
</xs: sequence> 
</xs:complexType > 


在 定义 上 述 复杂 数据 类 型 和 元 素 后 ,可 以 书写 下 面 的 XML 内 容 : 


< letter > Dear Mr. < name > John Smith </name >. Your order < orderid > 1032 </orderid > will be 
shipped on < shipdate > 2011-07-11 </shipdate>. </letter> 


介绍 完 XML Schema 中 声明 元 素 的 方法 后 ,下 面 通 过 一 个 例子 来 比较 一 下 DTD 和 
XML Schema 的 不 同 。 假 定 有 一 个 简单 的 XML 文档 内 容 如 下 : 
< 书本 > 
< 书 名 > 丁丁 历险 记 </ 书 名 > 


< 作者 > Georges Remi </ 作 者 > 
</ 书 本 > 


如 果 用 DTD 的 形式 来 定义 该 XML 文档 结构 ,DTD 定义 如 下 : 


<!ELEMENT 书本 ( 书 名 , 作者 )> 
<!ELEMENT 书 名 ( #PCDATA)> 
<!ELEMENT 作者 ( #PCDATA)> 


如 果 用 XML Schema 形式 来 定义 XML 文档 结构 , 则 XML Schema 定义 如 下 : 


<xs:element name = "书本 "type = "书本 类 型 "人 > 
< xs:complexTYpe name = "书本 类 型 "> 
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<xs:all> 
<xs:element name = " 书 名 " type = "string"/> 
<xs:element name = "作者 " type = "string"/> 
</xs:sequence> 
</xs:complexType > 


其 中 ,元 素 一 书本 二 的 取 值 类 型 为 用 户 定义 的 一 个 复杂 数据 类 型 ,因此 ,一 书本 二 元 素 
为 复杂 类 型 元 素 。 


3.5.6 声明 元 素 属性 


复杂 元 素 可 以 拥有 子 元 素 和 元 素 属性 ,简单 类 型 没有 元 素 属性 ,因此 ,元 素 属性 的 声明 
通常 是 在 复杂 数据 类 型 的 定义 中 实现 的 。 声 明 元 素 属性 的 一 般 形 式 是 : 


<xs:attribute name = "name" type = "datatype" default = "defaultvalue" use= "required|no"/> 


其 中 ,name 为 属性 名 ,type 是 指 属性 的 数据 类 型 ,default-vaue 是 属性 的 默认 值 ,use 设 


置 该 属性 是 否 为 必 选 属性 。 
【 例 3-24】 声明 一 个 空 元 素 二 product> ,拥有 一 个 长 度 为 6 个 数字 字符 的 编码 。 


示例 代码 如 下 : 


<xs:simpleType name = "idtype"> 
< xs:restriction base = "xs:string"> 
< xs:pattern value = "[0-9]{6}"/> 
</xs:restriction> 
</xs:simpleType > 
<xs:complexType name = "prodtype"> 
<xs:attribute name = "prodid" type= ”idtype"/> 
</xs:complexType > 
<xs:element name = "product" type = "prodtype"/> 


【 例 3-25】 声明 一 个 复杂 元 素 二 bookorder 二 ,拥有 两 个 子 元 素 二 bookname 二 和 


去 customer 一 以 及 一 个 orderid 属性 ,规定 一 个 订单 可 以 订 多 本 书 ,orderid 为 长 度 为 6 个 字 
符 的 字符 串 。 

要 实现 上 述 要 求 ,可 分 成 三 个 基本 步骤 ,如 下 。 

(1) 定义 简单 数据 类 型 ,进行 内 容 取 值 约束 和 限定 : 


<xs:simpleType name = "orderidtype"> 
< xs:restriction base= "xs:string"> 
<xs:pattern value= "[0-9]{6}"/> 
</xs:restriction> 
</xs:simpleType> 


(2) 定义 元 素 属性 : 


<xs:complexType name = "bookordertype"> 
<xs: sequence> 
<xs:element name = "customer" type = "xs:string"/> 
<xs:element name = "bookname" type = "xs:string" maxOccurs = "unbounded" /> 
</xs: sequence> 


146 


SA 


Web 技 术 导 论 (第 3 版 ) 


<xs:attribute name = "orderid" type = "xs:string" use = "required"/> 
<xs:anyAttribute/> 
</xs:complexType > 


(3) 声明 元 素 : 
<xs:element name = "bookorder" type = "bookordertype"/> 
在 元 素 属 性 的 声明 中 ,使 用 了 到 xs:anyAttribute/ 二 ,可 以 使 创作 者 在 元 素 中 添加 


orderid 以 外 的 任意 数量 的 属性 ,但 是 这 些 属性 必须 通过 Schema 声明 ,例如 ,我们 在 Schema 
中 包含 属性 note 的 声明 : 


<xs:attribute name = "note"> 
< xs:simpleType> 
< xs:restriction base = "xs:string"> 
<xs:pattern value= "普通 | 加 急 "/> 
</xs:restriction> 
</xs: simpleType > 
</xs:attribute> 


可 以 将 属性 应 用 到 二 bookorder 二 元 素 中 ,对 于 下 列 XML 内 容 : 


< bookorder orderid = "201201" note= "加 急 ”" status = "OK"> < customer > Hao </customer > 订购 图 书 
清单 < bookname > Web 技术 导论 (第 3 版 )</bookname ></bookorder> 
其 中 ,note 属性 是 有 效 的 ,虽然 未 在 < bookorder > 元 素 中 声明 ,但 status 属性 无 效 , 因 为 
在 schema 中 未 声明 该 属性 。 上 述 内 容 看 起 来 不 够 自然 ,可 以 将 其 关系 用 层次 缩 进来 表达 ， 
形式 如 下 : 
< bookorder orderid = "201201" note = "加 急 " status = "OK"> 
< customer > Hao </customer > 订购 图 书 清单 


< bookname > Web 技术 导论 (第 3 版 )</bookname> 
</bookorder > 


3.5.7 将 架构 应 用 到 XML 文档 


用 户 可 以 在 一 个 XML 文档 的 内 部 应 用 一 个 架构 ,从 而 使 用 架构 中 声明 的 元 素 或 定义 
的 数据 类 型 。 同 时 ,也 可 以 对 XML 文档 数据 进行 有 效 性 验证 。 在 XML 文档 中 应 用 架构 ， 
需要 在 该 文档 的 根 元 素 中 声明 xmlns, 一 般 形 式 是 : 


< rootelement xmlns = "Schema — URI XSD - file"> 


其 中 ,rootelement 为 用 户 希 望 应 用 架构 的 XML 文档 的 根 元 素 。Schema-URI 为 统一 
资源 标识 符 , 是 要 附加 的 架构 的 名 称 , 如 果 文 档 中 需要 应 用 多 个 Schema, 应 为 它们 的 命名 空 
间 命 名 ,以 便 在 使 用 不 同 的 Schema 中 的 元 素 时 ,不 至 于 出 现 元 素 重 名 。XSD-file 给 定 包含 
Schema 定义 的 xsd 文件 名 。 

下 面 设计 一 个 有 关 家 庭 的 模式 文档 family. xsd, 并 利用 该 Schema 完成 一 个 XML 文档 
Myfamily. xml 数据 的 验证 。 

代码 清单 : 模式 文件 family. xsd 
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<?xml version = "1.0" encoding = "gb2312"?> 
< xs:schema xmlns:xs = "http://www.w3. org/2001/XMLSchema" 
elementFormDefault = "qualified"> 
<xs:complexType name = "familytype"> 
<xs:sequence> 
<xs:element name = "father" type= "xs:string" minOccurs = "0"/> 
<xs:element name = "mother" type = "xs:string" minOccurs= "0"/> 


<xs:element name = "boy" type = "xs:string" min0ccurs = "0" maxOccurs = "5"/> 
<xs:element name = "girl" type = "xs:string" minOccurs = "0" maxOccurs = "5"/> 
</xs:sequence> 
</xs:complexType > 
<xs:complexType name = "hometype"> 
<xs:all> 
<xs:element name = "house" type = "xs:string" minOccurs = "1"/> 
</xs:all> 
</xs:complexType > 


<xs:element name = "familys"> 

<xs:complexType> 

<xs:sequence> 
<xs:element name = "family" type = "familytype" maxOccurs = "unbounded"/> 
</xs:sequence> 

</xs:complexType> 
</xs:element > 
<xs:element name = "family" type = "familytype"/> 
<xs:element name = "home" type = "hometype"/> 
</xs :schema > 


下 面 是 一 个 XML 实例 文档 myfamily. xml。 
代码 清单 : myfamily. xml 


<?xml version = "1.0" encoding = "gb2312"?> 
< familys xmlns:xsi = http://www. w3.org/2001/XMLSchema - instance 
xsi:noNamespaceSchemaLocation = "family. xsd"> 
< family> 
< father > Tony Smith</father> 
<boy> Linda </boy> 
</family> 
< family> 
< father> David Smith </father> 
<boy> mike </boy> 
< girl> Mary</girl> 
< girl> Susan</girl> 
</family> 
< family> 
< father> Michael Smith </father > 
</family> 
</familys> 


对 于 上 述 的 XML 文档 ,可 使 用 XMLSpy 验证 其 有 效 性 ,详细 介绍 参见 3.4 节 。 
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@.6 其 他 相关 技术 


XML 技术 包含 的 内 容 很 多 ,除了 XML 元 语言 规范 外 ,XML 文档 的 有 效 性 、XML 数据 
处 理 .XML 数据 转换 .XML 数据 显示 等 都 是 XML 技术 非常 重要 的 内 容 。 了 解 这 些 技术 及 
它们 的 用 途 、 相 互 之 间 的 关系 ,对 于 理解 XML 技术 至 关 重 要 。 


3.6.1 XML 文档 对 象 模 型 


XML 文档 对 象 模型 (Document Object Model,DOM) 是 W3C 制定 的 针对 XML 解析 器 
的 标准 接口 规范 ,是 XML 文档 的 应 用 程序 接口 。 在 应 用 程序 (例如 浏览 器 ) 中 ,基于 DOM 
的 XML 解析 器 依据 XML 的 文档 结构 ,将 一 个 XML 文档 转换 成 一 棵 节点 树 ( 通 常 称 DOM 
树 ) ,应 用 程序 通过 对 这 个 对 象 模型 的 操作 ,间接 地 实现 对 XML 文档 数据 的 操作 。 

由 于 XML 本 质 上 就 是 一 种 分 层 结 构 , 用 DOM 树 对 XML 文档 进行 描述 的 方法 是 相当 
有 效 的 。DOM 树 所 提供 的 随机 访问 方式 给 应 用 程序 的 开发 也 带 来 了 很 大 的 灵活 性 , 它 可 
以 任意 地 控制 整个 XML 文档 中 的 内 容 。 然 而 ,由 于 DOM 分 析 器 把 整个 XML 文档 转化 成 
DOM 树 放 在 了 内 存 中 ,因此 , 当 文 档 比较 大 或 者 结构 比较 复杂 时 ,对 内 存 的 需求 就 比较 高 。 
而 且 , 对 于 结构 复杂 的 树 的 遍历 也 是 一 项 耗 时 的 操作 。 所 以 ,DOM 解析 器 对 机 器 性 能 的 要 
求 较 高 ,实现 效果 不 十 分 理想 。 但 是 ,由 于 DOM 解析 器 所 采用 的 树 形 结构 的 思想 与 XML 
文档 的 结构 相 吻 合 , 又 可 以 进行 随机 访问 ,因此 ,DOM 解析 器 具有 广泛 的 使 用 价值 。 


1. XML DOM 的 组 成 


对 于 XML 应 用 开发 来 说 ,DOM 就 是 一 个 对 象 化 的 XML 数据 接口 ,一 个 与 语言 无 关 、 
与 平台 无 关 的 标准 接口 规范 。 它 定义 了 HTML 文档 和 XML 文档 的 逻辑 结构 ,给 出 了 一 种 
访问 和 处 理 HTML 文档 和 XML 文档 的 方法 。 利 用 DOM ,程序 开发 人 员 可 以 动态 地 创建 
文档 ,遍历 文档 结构 ,添加 、 修 改 、 删 除 文 档 内 容 , 改 变 文档 的 显示 方式 ,等 等 。 可 以 这 样 说 ， 
文档 代表 的 是 数据 ,而 DOM 则 代表 如 何 去 处 理 这 些 数据 。 无 论 是 在 浏览 器 中 ,在 服务 器 
上 ,还 是 在 客户 端 ,只 要 用 到 XML, 都 可 能 用 到 DOM 。 

作为 W3C 的 标准 接口 规范 ,目前 ,DOM 由 三 部 分 组 成 , 即 核心 (core)、HTML 和 
XML。 核 心 部 分 是 结构 化 文档 比较 底层 对 象 的 集合 ,定义 了 一 组 对 象 ,用 于 表达 HTML 和 
XML 文档 中 的 数据 。HTML 接口 和 XML 接口 两 部 分 则 是 专 为 操作 有 具体 的 HTML 文档 
和 XML 文档 所 提供 的 高 级 接口 ,使 对 这 两 类 文件 的 操作 更 加 方便 。 


2. 创建 DOM 文档 对 象 和 加 载 XML 


通过 DOM 访问 XML 数据 通常 有 两 种 方法 : 四 使 用 C、C++ 或 者 Visual Basic 等 访问 
XML 数据 ,此 时 用 户 必 须 安装 一 些 特殊 的 头 文件 和 库 ; 四 使 用 HTML 和 脚本 语言 
JavaScript\VBScript 等 通过 DOM 实现 XML 数据 的 访问 。 这 里 我 们 只 看 后 者 的 实现 
六 潜 。 

在 HTML 中 访问 XML, 首 先 要 创建 文档 对 象 。 在 JavaScript 中 ,可 通过 以 下 语句 
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完成 : 
var obj = new ActiveXObject("Microsoft.XMLDOM") 


上 述 语句 在 内 存 中 创建 一 个 空 对 象 obj ,要 加 载 一 个 XML 文档 , 需 通过 obj 对 象 的 load 
方法 完成 : 


Obj.async = false 
0bj. load( "XML 文档 的 URL") 


这 里 我 们 给 async 属性 赋值 为 false, 表 明 只 有 当 文 档 下 载 完毕 ,控制 才 返 回 给 调用 进 
程 。load 方法 告诉 分 析 器 加 载 指 定名 字 的 XML 文档 。XML 文档 被 加 载 后 ,就 在 内 存 中 形 
成 了 一 棵 DOM 树 。 

例如 ,books. xml 文档 内 容 如 下 : 


<?xml version= "1.0" encoding = "gb2312" ?> 
<books> 
<book status = "已 售 完 "> 
<title> Web 技术 导论 </title> 
< author > HaoXingwei </author > 
</book> 
<book status = "热卖 中 "> 
<title> Web 开发 技术 </title> 
<author > HaoXingwei </author > 
</book> 
</books> 


形成 的 DOM 树 如 图 3-11 所 示 。 


document 文档 对 象 
books 根 节点 
book book 节点 
title author title | author 节点 


已 售 完 Web 技 术 导 论 HaoXW || Web 开发 技术 HaoXW 热卖 中 text 属 性 


图 3-11 XML DOM 树 示意 


从 图 3-11 所 示 的 DOM 树 中 可 以 看 到 ,在 文档 对 象 中 ,包含 了 一 个 与 XML 文档 相 一 致 
的 树 。 树 的 根 节点 对 应 于 XML 的 根 元 素 , 其 他 节点 对 应 于 XML 文档 中 不 同 层 次 上 的 元 
素 。 所 有 节点 均 为 Node 类 型 对 象 。 


3. XML DOM 对 象 


文档 对 象 模型 利用 对 象 将 XMLVHTML 文档 模型 化 ,这 些 模型 不 仅 描述 了 文档 的 结 
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构 , 还 定义 了 模型 中 对 象 的 行为 。 在 DOM 树 中 ,每 一 个 节点 不 是 数据 结构 ,而 是 对 象 ,对 象 
中 包含 属性 和 方法 。 在 DOM 接口 规范 中 ,有 4 个 基本 的 接口 : Document、Node、NodeList 


和 NamedNodeM 
1) 文档 对 象 


ap。 
(Document) 


文档 对 象 是 从 Node 接口 继承 过 来 的 ,代表 整个 XML/HTML 文档 ,是 整 棵 文档 树 的 
根 ,是 所 有 数据 、 所 有 其 他 组 件 , 比 如 注释 和 处 理 指令 节点 的 总 的 容器 ,提供 了 对 文档 中 的 数 
据 进 行 访问 和 操作 的 入 口 。 


(1) Document 对 象 常 用 属性 如 下 。 


@ documentElement: Element 类 型 的 只 读 属 性 ,返回 文档 的 根 节点 对 象 。 
@ async: 逻辑 类 型 的 属性 ,指定 是 否 允 许 同 步 下 载 文件 。 


@ parseError: 返回 解析 错误 对 象 。 
(2) Document 对 象 常用 方法 如 下 。 


O@O load(pathname) : 把 文件 加 载 到 文档 对 象 。 
@ loadMXL(string): 加 载 XML 文档 或 段 。 
@ createAttributeCname) : 创建 属性 方法 。 
@ createNode(Type,Name,namespaceURI) : 创建 一 个 类 型 为 Type、 名 称 为 Name, 并 


且 使 用 namespaceURI 作为 名 称 空间 的 节点 。 


2) 节点 对 象 


(Node) 


XML/HTML 中 的 每 一 个 元 素 都 对 应 DOM 树 中 的 一 个 节点 对 象 。Node 接口 是 其 他 
大 多 数 接口 的 父 类 ,如 Documet、Element、Attribute、Text、Comment 等 接口 都 是 从 Node 


接口 继承 过 来 的 。 
Node 对 象 常用 属性 见 表 3-21。 
表 3-21 Node 对 象 常用 属性 
属性 名 您 文 属性 名 4 
atrribute 节点 的 属性 集 nextSibling 当前 节点 的 下 一 个 兄弟 节点 
childNodes 当前 节点 所 有 子 节点 的 nodeList | nodeName 节点 名 
dataType 设置 或 获得 节点 数据 的 类 型 nodeType 节点 类 型 
firstChild 当前 节点 的 首 子 节点 parentNode 。 父 节点 对 象 
lastChild 当前 节点 的 末 子 节点 text 设置 或 获得 节点 文本 
nameSpace 返回 名 称 空间 的 URI xml 返回 指定 节点 的 xml 表示 
Node 对 象 常用 方法 见 表 3-22。 
表 3-22 Node 对 象 常用 方法 
方法 名 功 能 方法 名 功 能 
appendChild 添加 新 节点 removeChild 删除 子 节点 
cloneNode 克隆 节点 replaceChild 替换 节点 
hasChildNodes 当前 节点 是 否 有 子 节点 selectNodes 选择 节点 列表 及 其 后 代 
insertBefore 插入 节点 selectSingleNode 选择 节点 及 其 后 代 
parsed 节点 是 否 被 解析 
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3) 节点 列表 对 象 (NodeList) 

NodeList 接口 是 一 个 节点 的 集合 , 它 包 含 某 个 节点 中 的 所 有 子 节点 。 在 DOM 中 ， 
NodeList 的 对 象 是 实时 更 新 的 ,对 文档 的 改变 ,会 直接 反映 到 相关 的 NodeList 对 象 中 。 例 
如 ,如 果 通过 DOM 获得 一 个 NodeList 对 象 , 该 对 象 中 包含 某 个 Element 节点 的 所 有 子 节 
点 的 集合 , 当 通 过 DOM 对 Element 节点 进行 添加 、 删 除 等 操作 时 ,这 些 改变 将 会 自动 地 反 
映 到 NodeList 对 象 中 ,而 不 需 DOM 应 用 程序 再 做 其 他 额外 的 操作 。 

NodeList 是 一 个 节点 对 象 列表 ,只 有 一 个 Length 属性 ,其 值 为 对 象 中 包含 节点 的 个 
数 。NodeList 中 的 每 个 item 可 以 通过 一 个 索引 来 访问 ,该 索引 值 从 0 开始 。 主 要 的 方法 有 
item(Index) ,nextNode() 和 reset() ,详细 介绍 上 略 。 

4) 名 字 空 间 对 象 (NamedNodeMap) 

NamedNodeMap 接口 也 是 一 个 节点 的 集合 ,通过 该 接口 ,可 以 建立 节点 名 和 节点 之 间 
的 一 一 映射 关系 ,从 而 利用 节点 名 可 以 直接 访问 特定 的 节点 。 和 NodeList 对 象 不 同 ， 
NamedNodeMap 所 包含 的 节点 集中 的 节点 是 无 序 的 。 尽 管 这 些 节 点 也 可 以 通过 索引 来 进 
行 访问 ,但 这 只 是 提供 了 枚 举 NamedNodeMap 中 所 包含 节点 的 一 种 简单 方法 ,并 不 表明 在 
DOM 规范 中 为 NamedNodeMap 中 的 节点 规定 了 一 种 排列 顺序 。 

【 例 3-26〗 设 有 一 个 XML 文档 books. xml, 记 录 了 有 关 图 书 数据 。 要 求 写 一 个 
HTML 文档 ,通过 DOM 模型 将 books. xml 中 各 本 书 的 书 名 加 到 一 个 列表 控件 中 , 单 击 列 
表 控件 中 的 书 名 ,显示 该 书 数据 。 

分 析 : 这 是 一 个 利用 HTML 文档 显示 XML 文档 数据 的 问题 ,也 很 好 地 反映 了 HTML 
用 于 数据 展示 和 XML 用 于 数据 表达 的 思想 定位 。 

代码 清单 1: chinesebooks. xml 文档 内 容 

<?xml version= "1.0" encoding = "gb2312" ?> 

< 中 国 古 典 名 著 > 

< 图 书 > 

< 书 名 > 三 国 演义 </ 书 名 > 
< 作者 > 罗贯中 </ 作 者 > 
</ 图 书 > 

< 图 书 > 

< 书 名 > 西游 记 </ 书 名 > 
< 作者 > 吴承恩 </ 作 者 > 
</ 图 书 > 

< 图 书 > 

< 书 名 > 红楼 梦 </ 书 名 > 
< 作者 > 曹雪芹 </ 作 者 > 
</ 图 书 > 

< 图 书 > 

< 书 名 > 水 游 传 </ 书 名 > 
< 作者 > 施 耐 庵 </ 作 者 > 
</ 图 书 > 

</ 中 国 古 典 名 著 > 


代码 清单 2: chinesebook. htm 文档 内 容 


<html> 


151 


MA 


152。 ”Web 技 术 导 论 (第 3 版 ) 


SAA 


<head> 
< script language = "JavaScript"> 
function createlist() 
{ 
var str = "< select size= '4' id = 'D1' onChange = 'selectbook(D1. selectedIndex) >"; 
var mybook = new ActiveXObject("Microsoft. XMLDOM" ) ; 
mybook.async = false; 
mybook. load( "chinesebook. xml1" ); 
// 返 回 文档 的 根 节点 对 象 
root = mybook. documentElement; 
for (var i=0; i<root.childNodes. length; i++) 
' 
booknode = root. childNodes. item(i); 
al = booknode. childNodes. item( 0). text; 
str += "<option>"+ al +"</option>"; 
} 
str += "</select >"; 
booklist. innerHTML = str; 
} 
function selectbook(i) 
{ 
booknode = root. childNodes. item( i); 
booktitle. innerText = booknode.childNodes. item(0). text; 
bookauthor. innerText = booknode. childNodes. item(1). text; 
} 
</script > 
</head> 


<body> 

<hl align = "center"> 中 国 古典 名 著 </hl > 

<table border = "1" width= "400" bgcolor = "#CCFFCC"> 
<tr height = "30"> 


< td widt 00" align = "center"> 书 名 </td> 
< td align = "center"> 图 书信 息 </td> 

</tr> 

<tr> 


<td id= "booklist" align= "center" ></td> 
<td align="left"> 
<p> 书 名 : < span id = "booktitle"></span></p> 
<p> 作 者 : < span id = "bookauthor"></span></p> 
</td> 
</tr> 
</table> 
< script> 
createlist(); 
</script > 
</body> 
</html > 


在 上 述 chinesebook. htm 代码 中 ,通过 脚本 程序 生成 一 个 下 拉 列 表 , 当 单 击 其 中 列表 项 时 ， 
修改 右 侧 单 元 格 的 图 书信 息 。 文 档 chinesebook. htm 在 全 中 的 显示 结果 如 图 3-12 所 示 。 
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中 国 古典 名 著 
| 书 名 图 书信 息 
] 三 本 书 名 : 西游 记 


水 洲 传 作者 :吴承恩 


图 3-12 应 用 DOM 对 象 示例 


不 是 所 有 的 浏览 器 均 支 持 Microsoft. XMLDOM ,Firefox 浏览 器 将 不 能 显示 上 述 页 面 。 
通过 上 面 的 这 个 例子 ,可 以 看 出 xml 文档 是 对 数据 的 一 种 描述 ,是 存储 数据 的 一 种 形式 ,而 
html 文档 的 重点 在 于 展示 数据 。 理 解 这 一 点 对 于 理解 xml 是 非常 重要 的 。 


3.6.2 可 扩展 样式 语言 


W3C 给 出 了 两 种 样式 单 语言 的 推荐 标准 ,一 种 是 层 倒 样式 单 (CSS), 另 一 种 是 可 扩展 
样式 单 语言 (eXtensible Stylesheet Language,XSL)。 样 式 单 (Style Sheet) 是 一 种 专门 描述 
结构 文档 表现 方式 的 文档 , 它 既 可 以 描述 这 些 文档 如 何在 屏幕 上 显示 ,也 可 以 描述 它们 的 打 
印 效果 ,其 至 声音 效果 。 使 用 样式 单 的 目的 就 是 要 保证 文档 内 容 和 文档 显示 的 彻底 分 离 。 
CSS 主要 应 用 在 HTML 的 页 面 制作 ,而 可 扩展 样式 语言 (eXtensible Style Language, XSL) 
则 是 用 于 描述 XML 文档 样式 的 语言 。 


1. XSL 简介 


在 Internet 中 ,XML 已 经 成 为 不 同 应 用 之 间 的 数据 交换 标准 ,从 根本 上 解决 了 应 用 系 
统 间 的 信息 交换 ,保证 了 数据 的 平台 无 关 性 。 为 了 使 数据 适合 不 同 的 应 用 程序 ,我 们 必须 能 
够 将 一 种 数据 格式 转换 为 男 一 种 数据 格式 ,比如 ,需要 的 格式 可 能 是 一 个 文本 文件 ,一 个 
SQL 语句 ,一 个 HTTP 信息 一定 顺序 的 数据 调用 等 。 

此 外 ,对 于 XML 文档 数据 ,可 能 还 需要 将 XML 数据 以 不 同 的 方式 进行 显示 。 在 XML 
技术 中 ,可 以 和 HTML 一 样 , 定 义 样式 表 (. css) 文 件 , 在 XML 文档 的 序言 中 增加 声明 显示 
该 XML 文档 要 使 用 的 样式 表 , 处 理 指令 为 “一 ? xml-stylesheet type 一 "text/css”href 一 
"mycssfile. css"? 二 ”, 然 后 通过 在 XML 元 素 中 使 用 class 属性 和 id 属性 来 定制 元 素 的 显 
示 。 但 是 ,必须 要 记 住 的 是 : XML 技术 的 核心 是 将 数据 和 数据 的 显示 分 离 , 任 何在 XML 
文档 内 容 中 包含 显示 信息 的 XML 文档 都 认为 是 含有 bug 的 ,因此 ,这 样 的 设计 不 符合 
XML 的 思想 。XML 技术 的 基本 规则 是 ,XML 文档 存储 数据 本 身 ,对 数据 的 显示 则 通过 
XML 数据 的 应 用 程序 来 完成 。 

基于 上 述 两 个 方面 的 原因 ,W3C 颁布 了 可 扩展 样式 语言 (XSL) 规 范 ,用 于 XML 文档 的 
转换 和 显示 。XSL 在 转换 XML 文档 时 分 为 两 个 过 程 : 首先 转换 文档 结构 ,然后 将 文档 格 
式 化 输出 。 这 两 步 可 以 分 离开 来 并 单独 处 理 ,因此 XSL 在 发 展 过 程 中 逐渐 分 为 XSLT 
(XSL Transformations) 和 XSL-FO(CXSL Formatting Objects) 两 种 分 支 语言 。XSLT 用 来 
实现 XML 文档 结构 的 转换 ,其 中 ,将 XML 文档 转换 为 HTML 文档 是 目前 XSLT 最 主要 
的 功能 。XSL-FO 的 作用 则 类 似 CSS 在 HTML 中 的 作用 。 
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2. XSLT 样式 文档 基本 结构 


XSL 样式 文档 用 于 处 理 XML 文档 内 容 的 格式 化 显示 ,可 以 说 XML 十 XSL 就 可 以 达到 
HTML 的 显示 效果 ,但 XSL 对 数据 的 显示 更 灵活 ,对 于 同一 个 XML 文档 ,可 以 编写 不 同 的 
XSL ,来 得 到 不 同 的 显示 。 

XSL 文档 本 身 是 一 个 XML 文档 ,遵守 XML 的 语法 规则 ,是 XML 的 一 种 具体 应 用 。 
XSL 样式 文档 基本 结构 如 下 : 


<?xml version= "1.0" encoding = "gb2312"?> 
<xsl:stylesheet version= "2.0" 
xmlns:xsl = http://www. w3. org/1999/XSL/Transform 
xmlns:xs= "http://www. w3.org/2001/XMLSchema" 
xmlns:fn= "http://www. w3.org/2005/xpath-functions"> 
<xsl:output method = "xml" version= "1.0" encoding= " gb2312" indent = "yes"/> 
模板 定义 1 
模板 定义 2 


</xsl:stylesheet > 


第 一 行为 XML 处 理 指令 ,告诉 XML 解析 器 文档 为 XML 文档 。 到 stylesheet 二 元 素 是 
XML 文档 的 根 元 素 ,version 属性 指示 该 XSL 文档 遵从 哪 一 个 版 本 的 XSL 标准 ,xmlns:xsl 
指示 了 XSL 的 命名 空间 。 一 output 二 元 素 设置 XSL 的 输出 文档 类 型 ,其 中 属性 method 一 
"xml" 表 明 输 出 为 XML 文档 ,如 果 要 输出 HTML 文档 , 则 应 设置 method="html"。 如 果 
文档 中 不 出 现 xsl:output ,将 默认 输出 为 XML 文档 ,但 如 果 在 匹配 模板 时 使 用 了 二 html 二 
标记 , 则 输出 为 html 文档 。 

XSL 文档 的 主要 内 容 是 一 系列 的 模板 ,通过 一 系列 模板 定义 来 描述 XML 文档 的 显示 
格式 。 模 板 通常 是 由 html 标记 和 XSL 元 素来 描述 的 ,以 实现 XML 文档 内 容 的 定位 和 处 
理 。XSL 由 多 个 模板 构成 ,其 中 匹配 XML 根 元 素 的 模板 为 默认 模板 ,通过 调用 相应 的 模 
板 ,完成 XML 文档 内 容 的 输出 。 

XSL 样式 文档 文件 扩展 名 为 . xsl, 要 使 用 xsl 显示 一 个 XML 文档 ,在 XML 文档 声明 
的 后 面 需 要 增加 一 条 处 理 指令 ,声明 用 于 显示 该 XML 文档 的 xsl 程序 。 一 般 形 式 如 下 : 


<?xml-stylesheet type = "text/xsl" href = "xslfile.xsl"?> 
其 中 ,xslfile. xsl 是 用 于 该 xml 文档 输出 的 XSLT 文件 。 
3. XSLT 元 素 


在 XSLT 规范 中 ,定义 了 大 量 的 XSLT 元 素 和 XSLT 函数 ,用 于 对 XML 文档 的 转换 ， 
这 些 常 用 的 XML 元素 见 表 3-23。 

在 XSL 样式 文档 中 ,元 素 二 choose 二 一 when 二 和 一 otherwise 二 总 是 一 起 使 用 ,构成 
程序 设计 中 的 多 分 支 选 择 逻 辑 。 而 一 element 二 和 二 attribute 二 元 素 则 可 以 通过 一 if 之 元 
素 动态 地 在 输出 中 添加 元 素 或 添加 元 素 属 性 。 下 面 举例 说 明 XSL 文档 中 XSL 元 素 的 
应 用 。 
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表 3-23 XSL 处 理 元 素 列表 


XSL 元 素 元 素 属 性 说 明 
声明 文档 为 样式 表 文档 ,XSLT 文档 如 果 由 
stylesheet 模板 组 成 ,任何 一 个 XSLT 文件 至 少 包含 一 
个 模板 
name, 模 板 名 称 ,可 选 属性 
| 定义 一 个 模板 ,每 个 模板 负责 处 理 XML 文 
template ee 档 内 某 一 类 型 的 标记 。 模 板 元 素 标记 的 内 容 


priority, 模 板 的 优先 级 编号 (0 一 9) 
mode, 模 式 值 ,允许 多 次 处 理 某 个 元 
素 ,每 次 产生 不 同 的 结果 


将 被 输出 ,通常 是 HTML 代码 


apply-templates 


select, 被 选择 的 节点 名 或 节点 集 
mode, 同 template 元 素 


XSL 处 理 器 选择 一 个 基于 某 个 匹配 的 模板 


call-template name, 被 调用 的 模板 的 name 属性 值 调用 模板 名 所 指定 的 模板 
value-of select, 被 选择 的 节点 名 输出 被 选择 节点 的 值 或 属性 值 
copy 复制 指定 节点 下 的 内 容 到 输出 文档 
简单 条 件 判 断 , 当 条 件 值 为 True 时 执行 该 元 
素 内 容 , 否 则 不 执行 该 元 素 内 容 。 如 果 存 在 
. rl seript 属性 , 则 可 以 用 脚本 语言 表达 式 为 测试 
条 件 
与 xsl:when 和 xsl:otherwise 元 素 一 起 ,提供 
choose i 
多 条 件 判断 。 类 似 于 switch 语句 
when test, 同 一 if 全 元素 在 一 个 xsl:choose 元 素 内 提供 单一 条 件 判断 
otherwise 为 一 个 xsl:choose 元 素 提供 默认 处 理 
select, 确 定 要 循环 访问 的 节点 集 A 
for-each order-by 设 方式 ,在 节点 名 前 用 “十 ”, 表 An 的 
示 按 降序 排列 ,“ 一 "表示 按 升序 排列 
name, 元 素 名 称 ,通常 是 一 个 HTML 
标记 
element namespace, 元 素 的 命名 空间 URI 输出 一 个 HTML 元 素 
use-attribute-sets, 通 过 空白 分 隔 的 属 
性 集 列表 
name, 必 选项 ,为 要 创建 的 标记 属性 
attribute 的 名 称 标记 添加 属性 ,并 设置 属性 值 
namespace, 同 element 元 素 
comment 在 输出 中 创建 一 个 注释 节点 
include re 标识 要 包含 的 XSLT 文件 的 统 | 在 一 个 XSLT 文件 中 包含 另 一 个 XSLT 文件 


一 资源 标识 符 (URD 引用 


设 有 一 xml 文档 bookslist. xml, 代 码 如 下 : 


<?xml version = "1.0" encoding = "gb2312"?> 
<?xml — stylesheet type = "text/xsl" href = "bookslist.xsl"?> 


<collection> 


< bookitem> 
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<title> The Adventures of Tom Sawyer </title> 
< author > Twain, Mark </author > 
<isbn>978-7-12345678 -a</isbn> 
</bookitem> 
< bookitem> 
<title> The Little Match— Seller </title> 
< author > Andersen, Hans C. </author > 
< isbn> 978 -7- 12345678 一 b</isbn> 
</bookitem> 
</collection> 


在 上 述 XML 文档 中 ,第 二 行 处 理 指令 指示 要 引用 的 XSL 文档 。 

【 例 3-27】 写 一 个 XSLT 文档 bookslist. xsl, 将 bookslist. xml 数据 按照 表格 形式 
输出 。 

代码 清单 : bookslist. xsl 


<?xml version = "1.0" encoding = "gb2312"?> 
< xs1:stylesheet xmlns:xsl = "http://www.w3.org/TR/WD - xsl"> 
<xsl:template match = "/"> 
<html> 
<head> 
<style> 
.title {font— size:15pt; font - weight:bold; color:blue } 
.name {color:red} 
</style> 
</head> 
<body> 
<xsl:apply— templates select = "/collection"/> 
</body> 
</html > 
</xsl:template> 


<xsl:template match = "/collection"> 
<p class = "title" align = "center"> 中 文 图 书 清单 </p> 
<table border = "1" align = "center"> 
<thead> 
<td align = "center" width= "250"><b> 书 名 </b></td> 
<td align = "center" width= "150"><b> 作 者 </b></td> 
<td align= "center" width= "150"><b> 书 号 </b></td> 
</thead> 
<xsl:for ~ each select = "/collection/bookitem" order - by= " — isbn"> 
<tr> 
<td><xsl:value— of select = "title"/></td> 
<td><xsl:value— of select = "author"/></td> 
<td align = "center"><xsl:value — of select= "isbn" 人 ></td> 
</tr> 
</xsl:for 一 each> 
</table> 
</xsl:template> 
</xsl:stylesheet > 
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在 bookslist. xsl 中 ,我 们 定义 了 两 个 模板 ,第 一 个 模板 为 默认 模板 ,输出 了 HTML 文 
档 的 框架 ,并 调用 了 第 二 个 模板 ,图 书 清单 表格 的 输出 是 通过 第 二 个 模板 完成 的 。 
输出 结果 如 图 3-13 所 示 。 
可: \ 教 材 -Yeb 技 术 导 论 (第 3 版 )\bookslist. xsl ~ icreseft TateracoroeglsE| 
ET 下 2 


RE NTE 二 炎 包 | 所 -中 己 癌 基 
钴 十 加 | 外 ] :吉村 -web 技术 导论 第 3 版 )\bookslist xnl SSE 链接 ”> 


中 文 图 书 清单 


| 局 帮 和 寺村 


[The Title Match-Seller [Andersen, Hans C. | 978-7-12345678-b 
[The Adventures of Tom Sawyer [Twain, Mark 978-7-12345678-a 


图 3-13 XML 文档 的 XSLT 输出 界面 


【 例 3-28〗 有 一 个 描述 网 络 课程 知识 单元 的 XML 文档 ,要 求 编写 一 个 XSLT 文档 , 输 
出 该 xml 文档 内 容 。 

分 析 : 对 XML 文档 内 容 的 输出 和 显示 有 多 种 方法 ,前 面 我 们 看 到 了 使 用 DOM 的 方 
法 ,也 可 以 使 用 css, 但 这 两 种 输出 前 者 与 浏览 器 有 关 ,css 则 不 符合 xml 数据 与 显示 彻底 分 
离 的 思想 ,正确 的 输出 就 是 XSL。 

代码 清单 1: 知识 单元 XML 文档 内 容 清 单 (ku-osi. xml) 。 


<?xml version= "1.0" encoding = "gb2312" ?> 
<?xml - stylesheet type = "text/xsl" href = "ku— osi.xsl" ?> 
<ku> 
<title>2.1 The OSI model </title> 
<LearningObjectives> 
<objectiveitem>(1) 了 解 0SI 七 层 模型 </objectiveitem> 
< objectiveitem>(2) 掌 握 各 层 名 称 及 其 功能 </objectiveitem> 
< objectiveitem>(3) 理 解数 据 封装 过 程 </objectiveitem> 
</LearningObjectives > 


<kplist> 
<kpitem> 
<kptitle> 0SI 模型 </kptitle> 
< loitem filename = "osi. swf"> 0SI 模型 </loitem> 
< loitem filename = "osiencapsulation. swf"> 数 据 封装 过 程 </loitem> 
</kpitem> 


<kpitem> 
<kptitle > 数据 封装 </kptitle> 
<loitem filename = "osiencapsulation. swf"> 数 据 封 装 过 程 </loitem> 
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vt 


</kpitem> 
</kplist > 


<contents> 

20 世纪 80 年 代 末 90 年 代 初 ,<kp> 计 算 机 网 络 </kp> 迅 猛 发 展 .为 了 帮助 网 络 厂商 建构 网 络 以 及 支持 
网 络 互 操 作 ,<kp> ISO 组 织 </kp> 定 义 了 异 质 系 统 互联 的 七 层 框架 体系 结构 标准 ,也 称 为 <kp> 0SI 参 
考 模型 (0SI Reference Model)</kp >. 


</contents> 


<addfilelist> 
< figitem filename = "internetclouds. jpg"> 图 2- 1 互联 网 概念 模型 </figitem> 
</addfilelist> 


<refs> 
< refitem filename = "jsjwl. htm"> 计 算 机 网 络 的 概念 和 分 类 </refitem> 
<refitem filename = "wlsb. htm"> 网 络 设备 及 其 功能 </refitem> 
</refs> 
</ku> 


下 面 是 用 于 显示 上 述 XML 文档 的 XSLT 程序 清单 。 
代码 清单 2: XSLT 文档 ku-osi. xsl 内 容 清单 。 


<?xml version= "1.0" encoding = "GB2312"?> 
<xsl:stylesheet xmlns:xsl = "http://www. w3. org/TR/WD — xsl"> 


<xsl:template match = "/"> 
< htm]l > 
<body> 
<table border = "0”width = "100%" cellspacing = "0" cellpadding = "0"> 
<tr> 
< td height = "26" bgcolor = "#CC0033"> 
< font color = "#FFFFFF"><xsl:value — of select = "ku/title"/></font> 
</td> 
</tr> 
</table> 
< xsl:apply- templates select = "/ku/LearningObjectives"/> 
<xsl:apply - templates select = "/ku/contents"/> 
< xsl:apply- templates select = "/ku/addfilelist"/> 
<xsl:apply — templates select = "/ku/kplist"/> 
</body> 
</html > 
</xsl:template> 


<xsl:template match = "/ku/LearningObjectives"> 
<table border = "0" width= "100%" cellspacing = "0" cellpadding = "0"> 
<tr height = "30"> 
<td><b> 学 习 目 标 </b></td> 
</tr> 
<xsl:for - each select = "objectiveitem"> 
<tr height = "25"> 
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<td style = "font - size:14px;"><xsl:value — of/></td> 
</tr> 
</xsl:for -each> 
</table> 
</xsl:template> 


<xsl:template match = "/ku/kplist"> 
<hr/> 
<table> 
<tr height = "30"> 
<td colspan = "2"><b> 主 要 知识 点 </b></td> 


</tr> 
<tr> 
<td width= "150"> 知 识 点 </td> 
<td> 学 习 对 象 </td> 
</tr> 
< xsl:for - each select = "/ku/kplist/kpitem"> 
<tr> 
<td><xsl:value— of select = "kptitle"/></td> 
<td> 
< xsl:for - each select = "loitem"> 
<a> 


<xsl:attribute name = "href"><xsl:value- of select = "@filename"/> 
</xsl:attribute> 
<xsl:value — of/></a> 
</xsl:for - each> 

</td> 

</tr> 

</xsl:for - each> 

</table> 
</xsl:template> 


<xsl:template match = "/ku/contents"> 
< hr/> 
<table> 
<tr> 
<td><xsl:value— of select = "/ku/contents"/></td> 
</tr> 
</table> 
</xsl:template> 


<xsl:template match = "/ku/addfilelist"> 
< hr/> 
<table> 
<tr height = "30"> 
<td colspan = "10"><b> 插 图 列表 </b></td> 
</tr> 
<tr> 
<xsl:for— each select = "figitem"> 
<td align = "center"> 
< xsl:element name= "img"> 
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<xsl:attribute name= "src"><xsl:value- of select="@filename"/> 
</xsl:attribute> 
</xsl:element > 
<br/> 
<xsl:value— of/> 
</td> 
</xsl:for -each> 
</tr> 
</table> 
</xsl:template> 


</xsl:stylesheet > 

上 述 XML 文档 定义 了 一 个 知识 单元 的 结构 ,包括 知识 点 ,每 一 个 知识 点 都 对 应 一 个 或 
多 个 学 习 对 象 , 每 一 个 学 习 对 象 对 应 一 个 指向 学 习 对 象 媒体 文件 的 超 链接 , 超 链接 二 a 二 属 
性 是 通过 二 xsl:attribute 记 元 素来 设 定 的 。 知 识 单元 还 可 以 附加 本 知识 单元 的 一 些 图 、 表 
等 ,对 于 xml 中 图 片 的 显示 ,和 超 链接 的 显示 不 同 , 例 子 给 出 了 另外 一 种 方法 , 即 通 过 二 xsl: 
element name 王 "img" 过 来 显示 。 

此 外 ,对 二 xsl:value-of/ 二 元 素 不 指定 参数 select, 则 输出 当前 元 素 的 内 容 , 如 果 要 输出 
一 个 元 素 的 属性 值 , 使 用 “元 素 名 /@ 属 性 ”的 形式 ,如 果 是 当前 节点 ,使 用 “@ 属 性 ” 即 可 。 

当 XML 文档 在 浏览 器 中 打开 时 ,显示 的 页 面 如 图 3-14 所 示 。 


(1) 了 解 OSI 七 层 模型 
(2) 掌握 各 层 名 称 及 其 功能 
(3) 理解 数据 封装 过 程 


20 世 纪 80 年 代 末 90 年 代 初 ， 计 算 机 网 络 迅猛 发 展 。 为 了 帮助 网 络 厂 商 建构 网 络 以 及 支持 网 络 互 操作 ，ISO 组 织 定义 了 
异 质 系统 互联 的 七 层 框架 体系 结构 标准 ， 也 称 为 OSI 参考 模型 《OSI Reference Model) 。 .… 


插图 列表 


图 3-14 XML 文档 使 用 XSLT 的 输出 界面 


3.6.3 XML 路 径 语言 
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XML 路 径 语言 (XML Path Language,XPath) 是 用 来 查询 和 定位 XML 文档 中 的 元 素 


或 文本 的 一 种 通用 查询 语言 。 


不 管 是 在 XSLT 还 是 XPointer 规范 中 ,都 需要 定位 XML 文 


档 树 中 的 元 素 ,元素 属 性 或 元 素 区 间 ,XPath 规范 的 目的 就 是 向 XSLT 和 XPointer 共同 需 
要 的 功能 提供 统一 的 语法 和 语义 ,可 以 说 ,XPath 是 一 种 XML 文档 内 容 寻 址 语言 。 

XPath 将 一 个 XML 文档 建 模 成 一 棵 节点 树 ,通过 路 径 表 达 式 来 实现 对 XML 文档 内 容 
的 定位 ,在 XML 文档 中 选择 节点 或 节点 集 , 从 而 实现 对 XML 文档 中 的 元 素 和 属性 进行 遍 
历 。XPath 1.0 于 1999 年 11 月 16 日 成 为 W3C 推荐 标准 ,2007 年 1 月 23 日 ,XPath 2.0 成 
为 W3C 推荐 标准 ,很 好 地 修复 了 XPath 1.0 版 中 的 问题 。 

本 节 将 以 一 个 简单 的 XML 文档 为 例 , 介 绍 XPath 中 相关 的 基本 概念 及 应 用 。 


<?xml version= "1.0" ?> 
< bookstore> 
< book lang= "eng"> 


<title> Aladdin and the Enchanted Lamp </title> 


< price>2.90</price> 


</book> 


< book lang = "eng"> 
<title> Huckleberry Finn </title> 
<price>2.80</price> 


</book > 


</bookstore> 


1. XPath 表达 式 
XPath 表达 式 是 使 用 运算 符 和 特殊 字符 构造 的 ,XPath 表达 式 可 以 返回 4 种 类 型 值 , 即 
节点 集合 (node set) ,布尔 值 (Boolean) .数字 和 字符 串 。 其 中 ,XPath 最 多 的 应 用 就 是 用 于 
确定 查询 范围 , 即 选 择 XML 文档 中 的 节点 集合 。 
XPath 运算 符 和 特殊 字符 见 表 3-24。 
表 3-24 XPath 运算 符 和 特殊 字符 


说 有 明 


示 例 


子 运算 符 , 在 左 侧 集合 中 的 直接 子 节点 元 素 
中 ,选择 运算 符 右 侧 的 指定 元 素 。 当 此 路 径 
运算 符 出 现在 模式 开头 时 ,表示 选择 根 节点 
下 的 直接 子 元 素 


itemyVitemName' 匹 配 一 item 之 节点 下 的 
< 一 itemName 二 子 节点 


递归 下 降 ,在 左 侧 集合 的 任意 深度 子 节点 中 
搜索 运算 符 右 侧 的 指定 元 素 。 当 此 路 径 运算 
符 出 现在 模式 开头 时 ,表示 应 从 根 节点 递归 
下 降 


itemyVitemName, 匹 配 一 item 二 节点 下 的 所 
有 < 一 itemName> 子 节点 


取 当 前 节点 元 素 
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续 表 
运算 符 或 本 
特殊 字符 村 几 
| 取 当 前 节点 的 双亲 元 素 节点 .… /itemName, 父 节点 下 的 itemName 节点 
类 通配符 ,选择 所 有 元 素 或 属性 book/ * ,一 book 一 节点 下 的 所 有 子 节点 
@ 属性 名 前 级 book/@isbn, 一 book 二 节点 的 isbn 属性 
@@* 属性 通配符 (选择 所 有 的 属性 ) book/@ * ,二 book> 节 点 下 的 所 有 属性 
命名 空间 分 隔 符 ,将 命名 空间 前 级 与 元 素 名 


或 属性 名 分 隔 
(@) 为 运算 分 组 ,明确 设置 优先 级 
应 用 筛选 模式 或 下 标 运算 符 。 可 以 在 其 内 | book[@isbn], 一 book 二 节点 下 有 属性 


加 指定 元 素 或 属性 ,也 可 加 上 额外 的 测试 条 件 | "isbn" 的 节点 
| 与 多 个 节点 匹配 book|title, 与 二 book> 或 过 title 二 匹配 
t 应 用 一 个 信息 方法 至 引用 节点 1!nodeName() ,返回 节点 的 确定 名 称 


在 介绍 XPath 应 用 前 , 先 说 明 一 下 上 下 文 节点 的 概念 。 所 谓 XPath 上 下 文 节点 ,就 是 
在 模板 设计 中 ,通过 二 xml: template 之 元 素 的 match 属性 定位 的 节点 , 它 是 当前 操作 的 节 
点 ,所 有 的 节点 定位 均 是 基于 该 节点 的 。 一 般 而 言 , 最 初始 的 上 下 文 节点 总 是 文档 中 的 确定 
位 置 ,如 文档 的 根 节点 。 在 默认 模板 中 ,match 一 "/" ,将 上 下 文 节点 定位 为 文档 的 根 。 

XPath 的 常用 表达 式 说 明 如 下 。 

(1) 文档 根 ,以 正 斜 杜 (/) 为 前 缀 的 表达 式 使 用 文档 树 的 根 作 为 上 下 文 。 需 要 说 明 的 
是 , 根 节点 不 是 根 元 素 , 它 是 一 个 抽象 的 节点 ,是 根 元 素 的 父 节点 ,用 “/” 表 示 。 

例如 ，/bookstore, 选 择 根 元 素 bookstore; bookstore/book, 选 择 bookstore 下 的 所 有 
book 子 元 素 ; /bookstore/ * ,选择 bookstore 元 素 下 的 所 有 子 节点 。 

(2) 根 元 素 ,使 用 正 斜 杠 后 接 星 号 (/ * ) 的 表达 式 使 用 根 元 素 作 为 上 下 文 。 

例如 ,/* ,表示 查找 文档 的 根 元 素 。 

(3) 特定 元 素 , 以 元 素 名 开头 的 表达 式 引用 特定 元 素 的 查询 ,从 当前 上 下 文 节点 开始 ， 
选择 当前 节点 的 所 有 子 节 点 。 

例如 ,bookstore, 选 择 bookstore 元 素 的 所 有 子 节点 。 

(4) 递归 下 降 , 使 用 双 正 斜 杠 (//) 表达 式 , 表 示 从 当前 节点 开始 选择 符合 条 件 的 所 有 
节点 元 素 。 如 果 此 运算 符 出 现在 模式 的 开头 ,上 下 文 相对 于 文档 的 根 。 

例如 ,//book, 选择 文档 中 的 所 有 book 元 素 ; //*?,? 选择 文档 中 的 所 有 元 素 ; 
bookstore//book, 选 择 bookstore 下 的 所 有 book 子孙 元 素 。 

.// 前 级 则 表明 上 下 文 从 层次 结构 中 当前 上 下 文 所 指示 的 级 别 开 始 。 

(5) 选择 属性 ,//@lang, 选 择 所 有 名 为 lang 的 属性 ; //title[@ * ] ,选择 所 有 title 元 
素 , 不 管 其 属性 如 何 。 

(6) 多 路 径 选 择 , 如 果 需 要 选择 多 个 路 径 ,可 以 使 用 “1” 操作 符 。 例 如 : 

//book/title|//book/price, 选 择 所 有 book 元 素 下 的 title 和 price 子 元 素 。 

//title|//price, 选 择 文档 中 的 所 有 的 title 元 素 和 price 元 素 。 

/bookstore/book/title|//price, 选 择 /bookstore/book/ 下 的 title 子 元 素 和 文档 中 的 所 
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有 price 元 素 。 
2. 位 置 路 径 与 位 置 步 


在 XPath 表达 式 中 由 反 斜 杠 分 开 的 每 个 部 分 被 称 为 一 个 位 置 步 (Location Step) , 换 句 
话说 ,位 置 路 径 (Location Path) 是 由 */” 分 隔 的 位 置 步 构成 的 一 个 表达 式 。 位 置 步 在 目标 文 
件 中 指定 一 个 位 置 ,通常 是 相对 于 一 个 已 知 的 位 置 ,如 文件 的 根 节点 或 另外 一 个 位 置 步 等 。 
位 置 步 由 一 个 XPath 轴 关 键 字 (axis) 、 节 点 测试 (node-test) 和 可 选 谓词 (predicate) 构 成 ,一 
般 形式 如 下 : 


axis: :node - test[predicate] 


其 中 , 轴 是 与 上 下 文 节点 相对 的 文档 的 一 部 分 , 它 定 义 了 一 组 与 当前 节点 有 特定 层次 关 
系 的 节点 。 节 点 测试 可 以 用 来 指示 位 置 路 径 中 一 组 合法 节点 的 任何 表达 式 , 节 点 测试 通过 
名 字 或 类 型 筛选 初始 结果 集 。 谓 词 是 一 个 逮 辑 表达 式 。 例 如 : 


/child: :spec/child: :body[position() =2] 


其 中 ,第 一 个 “/" 表 示 根 节点 ;“child: :spec" 是 第 一 个 位 置 步 ,表示 根 节点 的 spec 直接 
子 元 素 ,如 果 文 件 的 根 元 素 是 sepc, 计 算出 来 的 结果 应 为 根 元 素 , 否则 计算 结果 为 空 ; 
“child: :body[position() 二 2]” 是 第 二 个 位 置 步 ,表示 上 次 计算 出 来 的 元 素 的 第 二 个 body 
直接 子 元 素 。 在 上 面 的 例子 中 ,如 果 文 件 的 根 元 素 是 spec, 而 且 它 包含 两 个 以 上 的 body 子 
元 素 , 返 回 的 结果 将 是 一 个 元 素 ,否则 将 不 返回 结果 。 


3. 谓词 


谓词 用 于 寻找 特定 的 节点 或 一 个 包含 特定 值 的 节点 ,谓词 写 在 方 括号 中 。 例 如 
/bookstore/book[L1] ,表示 选 择 bookstore 元 素 下 的 第 1 个 book 子 元 素 。 
/bookstore/book[last()] ,选择 bookstore 元 素 下 的 最 后 一 个 book 子 元 素 。 
/bookstore/book[position() 一 3] .选择 bookstore 元 素 下 开始 的 两 个 book 子 元 素 。 
//titleL@lang] ,选择 所 有 的 包含 属性 名 为 lang 的 title 元 素 。 
//titleL@lang 王 'eng'] ,选择 所 有 的 包含 属性 名 为 lang 且 属 性 值 为 eng 的 title 元 素 。 
/bookstore/book[price 二 2. 00], 选 择 bookstore 元 素 下 所 有 包含 值 大 于 2. 00 的 price 
元 素 的 book 子 元 素 。 
/bookstore/book[price 二 2. 00 ]Vtitle, 选 择 bookstore 元 素 下 的 所 有 包含 值 大 于 2. 00 
的 price 元 素 的 book 子 元 素 下 的 title 子 元 素 。 


4. XPath 轴 


XPath 轴 (axis) 是 与 上 下 文 节点 相对 的 文档 的 一 部 分 , 它 定 义 了 一 组 与 当前 节点 有 特 
定 层次 关系 的 节点 。 各 轴 心 及 含义 见 表 3-25。 

XPath 轴 心 应 用 于 位 置 路 径 表 达 式 中 的 位 置 步 的 定义 ,在 轴 心 名 后 加 “: :” 来 确定 一 个 
位 置 步 中 的 节点 集 。 下 面 是 一 组 XPath 表达 式 及 含义 说 明 。 

(1) ./Order, 返 回 当 前 上 下 文中 名 为 Order 的 所 有 元 素 。 

(2) /Order, 返 回 文档 树 中 根 下 所 有 名 为 Order 的 元 素 。 


164 


MV 


Web 技 术 导论 (第 3 版 ) 


表 3-25 XPath 轴 心 


轴 心 名 称 说 明 
self 选择 当前 节点 ,也 可 以 用 “. ”来 表示 
attribute 选择 当前 节点 的 属性 
parent 选择 当前 节点 的 双亲 
ancestor 选择 当前 节点 的 所 有 祖先 
ancestor-or-self 选择 当前 节点 及 其 所 有 祖先 
child 选择 当前 节点 的 所 有 子女 
descendant 选择 当前 节点 的 所 有 子孙 
descendant-or-self 选择 当前 节点 及 其 所 有 子孙 
preceding 选择 当前 节点 前 面 的 节点 
preceding-sibling 选择 当前 节点 前 面 , 与 上 下 文 节点 同属 于 一 个 父 节点 的 那些 节点 
following 选择 上 下 文 节点 后 面 的 元 素 节点 
following-sibling 选择 当前 上 下 文 节点 后 面 ,与 上 下 文 节点 同属 于 一 个 父 节点 的 那些 节点 
namespace 选择 当前 节点 的 所 有 名 字 空 间 节 点 


(3) //Order, 返 回 从 文档 树 的 任何 地 方 找到 的 所 有 名 为 Order 的 元 素 ,不 管 深 度 或 层 
次 结构 。 
(4) child: :book[attribute: : publisher 二“ 张 三 ’], 返 回 孩 子 节点 中 出 版 商 为 张 三 的 
book 元 素 节 点 。 
(5) child: :book[ @publisher=“ 张 三’], 同 上 。 
(6) descendent: :book[count(child: :chapter) 二 5], 用 count 函数 检索 所 有 chapter 大 
于 5 的 后 代 book 节点 。 
(7) child: :book[ start-with(attribute: :publisher,“ 张 ”)], 使 用 start-with 函数 检索 所 
有 publisher 属性 以 * 张 "开头 的 book 子 节点 。 
【 例 3-29】 设 有 一 个 xml 文档 bookstore. xml, 使 用 XPath ,编写 一 个 用 于 输出 该 文档 
的 bookstore. xslt, 并 在 浏览 器 中 查看 输出 结果 。 
分 析 : 编写 xslt 文档 ,定位 节点 ( 集 ) 及 对 节点 和 属性 访问 是 关键 ,可 以 利用 XPath 来 完 
成 。 
代码 清单 : bookstore. xml 
<?xml version = "1.0" encoding = "gb2312"?> 
<?xml — stylesheet type = "text/xsl" href = "bookstore. xslt"?> 
< bookstore> 网 上 书店 
< 名 称 > World famous novels </ 名 称 > 
< 图 书 日 期 = "2003 - 11 - 24"> 
< 名 称 > ROMEO AND JULIET </ 名 称 > 
< 作者 > Shakespeare, William </ 作 者 > 
< 价格 > 30. 00 </ 价 格 > 
</ 图 书 > 
< 图 书 日 期 = "2006- 5 一 8"> 
< 名 称 > The Mysterious Island </ 名 称 > 
< 作者 > Verne, Jules </ 作 者 > 
< 价格 > 31. 00 </ 价 格 > 
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</ 图 书 > 
</bookstore> 


用 于 输出 的 bookstore. xslt 代码 如 下 : 


<?xml version= "1.0" encoding = "gb2312"?> 
<xsl:stylesheet version = "1.0" xmlns:xsl = "http://www. w3.org/1999/XSLVTransform"> 
< xsl:template match = "/"> 
< html > 
<head> 
<title> 练 习 使 用 XPath 轴 </title> 
</head> 
<body> 
< xsl1:apply- templates select = "bookstore"/> 
</body> 
</html > 
</xsl:template> 


<xsl:template match = "bookstore"> 
<xsl:apply- templates select = "child:: * "/> 
</xsl:template> 


<xsl:template match= "text()"> 
Textnode: <xsl:value — of select = "self::text()"/> <br/> 
</xsl:template> 


<xsl:template match = "”# "> 

Booknode: <xsl:value- of select= "self::*"/><br/> 
</xsl:template> 
</xsl:stylesheet > 


在 下 浏览 器 中 的 输出 结果 如 图 3-15 所 示 。 


恒 统 习 使 用 YPath 轴 - Nicrosoft Internet 了 Explore 


Booknode: Worldfamous novels 
Booknode: ROMEO AND JULIET Shakespeare, Wiltiam 30.00 
Booknode: The Mysterious Island Verne, Jules 31.00 


图 3-15 XPath 轴 的 应 用 输出 结果 界面 
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5. XPath 函数 


XPath 定义 了 一 组 内 置 函 数 , 称 为 核心 函数 库 。 在 XPath 1.0 中 ,包含 4 类 函数 ,分 别 
是 节点 集 函 数 , 字 符 串 函数 布尔 函数 和 数字 函数 。XPath 2. 0 对 函数 进行 了 很 大 的 扩充 ， 
分 成 7 类 ,包含 100 多 个 函数 ,这 些 函 数 针 对 字符 串 值 数字 值 . 日 期 和 时 间 比 较 、 节 点 操作 、 
顺序 操作 布尔 值 等 。 其 中 最 常用 的 节点 集 函 数 见 表 3-26 。 


表 3-26 XPath 常用 函数 


函 数 名 含 义 
last() 返回 上 下 文大 小 , 即 给 定 上 下 文中 的 节点 数 
position() 返回 上 下 文 位 置 , 即 当 前 节点 在 给 定 上 下 文 节点 集 (列表 ) 中 的 位 置 。 比 如 ,可 以 用 表 


达 式 position() 二 last() 测试 处 理 集合 中 的 最 后 一 个 节点 
count(node-set) ”返回 实 参 节点 集中 的 节点 数 


id(object) 返回 一 个 节点 集 ,根据 在 DTD 中 声明 为 ID 类 型 的 唯一 标识 符 选 择 元 素 
nodeName() 返回 节点 的 确定 名 称 

nodeType 返回 表示 被 选择 节点 类 型 的 数值 

index 返回 一 个 节点 在 同一 个 父 节 点 中 的 索引 值 

value 返回 一 个 元 素 值 的 类 型 强制 版 本 


关于 XPath 的 函数 的 详细 说 明和 使 用 请 参考 XPath 规范 。 

【 例 3-30】 设 有 一 个 XML 文档 xpathtest. xml, 编写 一 个 xslt 文档 ,选择 所 有 值 为 
green 或 blue 的 < x> 元 素 ,并 输出 。 

代码 清单 : xpathtest. xml 


<?xml version= '1.0'?> 
<?xml — stylesheet type = "text/xsl" href = "xpathtest. xsl"?> 
<root> 
<x> green </x> 
<y> 
<x> blue</x> 
<x>blue</x> 
</y> 
<z> 
<x>red</x> 
<x>red</x> 
</z> 
<x> green </x> 
</root> 


xpathtest. xsl 文档 代码 清单 : 


<?xml version = '1.0'?> 
< xsl:stylesheet version= "1.0" 
xmlns:xsl = "http://www. w3. org/1999/XSL/Transform"> 
<xsl:template match= "root"> 
<xsl:for — each select = "x | y/x"> 
<xsl:value — of select ="."/> 
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<xsl:if test = "not(position() = last())">,</xsl:if> 
</xsl:for -each> 
</xsl:template> 
</xsl:stylesheet > 


则 在 浏览 器 中 的 格式 化 输出 为 : 


green, blue, blue, green 


3.6.4 XML 查询 语言 (XQuery) 


现在 , 越 来 越 多 的 信息 以 XML 格式 进行 存储 和 交换 ,XML 数据 查询 成 为 重要 的 功能 
需求 。1999 年 ,W3C 成 立 了 XML 查询 工作 组 ,开始 研究 制定 相关 标准 规范 。 经 过 一 个 漫 
长 的 时 期 ,2005 年 11 月 ，W3C 发 布 了 关于 XML 查询 的 8 个 备 选 推荐 规范 。2007 年 1 月 
23 日 ,W3C 才 将 XPath 2.0 和 XQuery 1.0 确定 为 推荐 标准 。 

XQuery 1.0 是 XPath 2.0 的 扩展 集 , 除 了 拥有 XPath 2. 0 的 特点 外 ,增加 了 排序 、 重 
装 、 构 造 功能 ,而 且 实现 了 XPath 2. 0 未 能 实现 的 数据 浏览 和 过 滤 方 面 的 性 能 。XQuery 的 
优点 包括 : 

(1) 相 比 XSLT 的 查询 语句 ,XQuery 查询 语句 代码 更 简洁 。XQuery 执行 查询 需要 的 
代码 比 XSLT 少 , 所 以 它 的 执行 效率 也 高 。 

(2) 当 XML 数据 是 类 型 化 的 ,那么 XQuery 是 一 个 强 类 型 语言 , 它 能 够 通过 避免 非法 
的 类 型 转换 以 及 确认 类 型 是 否 可 以 在 查询 操作 中 使 用 ,来 提高 查询 语句 的 执行 效率 。 

(3) XQuery 能 当做 弱 类 型 语言 使 用 ,为 非 类 型 化 数据 提供 更 强 的 功能 。 

(4) XQuery 正在 成 为 W3C 工作 组 的 推荐 语言 ,同时 它 也 将 会 被 主流 的 数据 库 提供 商 
所 支持 。 

由 于 本 书 篇 幅 所 限 , 关 于 XQuery 的 基本 语法 和 应 用 请 参考 W3C 的 具体 规范 。 


3.6.5 可 扩展 连接 语言 


在 XML 的 规范 中 ,并 没有 规定 有 关 文件 链接 的 问题 。 为 了 使 XML 文件 也 能 够 有 类 似 
HTML 文件 超 链接 的 功能 . W3C 制定 了 XML 可 扩展 链接 语言 规范 (eXtensible Linking 
Language,XLL) 规 范 , 其 分 为 三 个 部 分 : XLink 语言 .XPointer 语言 和 XML Base。 其 中 
XLink 是 规定 XML 文件 之 间 的 链接 规范 (和 HTML 中 的 外 链接 相似 ),XPointer 是 规定 
XML 文件 中 不 同位 置 之 间 的 链接 规范 (类 似 HTML 中 的 书签 )。 通 过 XLink 规范 和 
XPointer 规范 可 以 定义 类 似 HTML 中 一 a 二 标记 的 超 链接 功能 ,然后 通过 xsl 显示 该 超 
链接 。 

1. XML 文档 链接 XLink 规范 


XLink 所 设 定 的 链接 分 为 简单 链接 (Simple Link) 和 扩展 链接 (Extended Link) 。 其 中 ， 
Simple Link 的 链接 功能 和 HTML 的 超 链接 基本 上 一 样 ,将 单个 源 文档 和 多 个 目标 文档 相 
链接 。Extended Link 则 超出 了 HTML 超 链 接 的 功能 , 它 链接 的 对 象 可 以 一 次 设 定 多 个 ， 
允许 在 多 个 源 文档 和 多 个 目标 文档 之 间 建 立 链接 。 
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下 面 主要 介绍 XLink 中 的 简单 链接 的 定义 和 显示 方法 。 

在 XML 文件 中 定义 使 用 XLink 元 素 的 时 候 , 必 须要 在 DTD 中 声明 链接 元 素 。 下 列 
XML 代码 声明 了 一 个 Simple Link 类 型 的 XLink 元 素 二 friendlink 之 。 然 后 ,通过 
二 friendlink 写 元 素 标记 XML 文档 中 的 超 链接 。XML 文档 名 为 myfriends. xml。 


<?xml version= "1.0"?> 
<?xml — stylesheet type = "text/xsl" href = "friendlists. xsl" ?> 
<! DOCTYPE myfriends[ 
<!ELEMENT myfriends ANY> 
<! ELEMENT friendlink ANY> 
<! ATTLIST friendlink 
xmlns:xlink CDATA #FIXED "http://www.w3.org/TR/xlink" 
xlink:type (simple|extended| locator|arc) #FIXED "simple" 
xlink:href CDATA # REQUIRED 
xlink:role CDATA # IMPLIED 
xlink:title CDATA # IMPLIED 
xlink: show (new|parsed|replace) "parsed" 
xlink:actuate (user|auto) "auto"> 
]> 
<myfriends > 
< friendlink xmlns:xlink = "http://www. w3. org/TR/xlink" 
xlink:href = "http://127.0.0.1/personlists.xml"> Jane</friendlink> 
</myfriends> 
在 定义 一 个 XLink 元 素 时 ,首先 声明 XLink 名 称 空间 , 即 : xmlns:xlink CDATA # 
FIXED http://www. w3. org/TR/xlink, 该 名 称 空间 对 应 XLink 规范 中 定义 的 一 组 元 素 和 
属性 。 利 用 这 些 默认 属性 ,来 定义 用 户 的 XLink 元 素 属性 ,主要 的 属性 如 下 。 
(1) type: 指明 链接 类 型 是 Simple Link 还 是 Extended Link。 
(2) href: 用 来 设 定 链接 的 地 址 ,与 HTML 中 二 a 二 标记 中 的 href 属性 一 样 。 
(3) role: 声明 该 链接 功能 ,提供 给 应 用 程序 读 取 。 
(4) title: 声明 该 链接 功能 ,提供 给 用 户 读 取 , 与 HTML 中 过 a 二 标记 的 alt 属性 相似 。 
(5) show: 有 三 种 取 值 ,replace 表示 用 链接 的 内 容 取代 当前 的 内 容 ,new 表示 将 链接 的 
内 容 在 一 个 新 的 窗口 打开 ,embed 表示 将 链接 的 内 容 加 入 到 当前 的 内 容 中 。 
(6) actuate: 设置 该 链接 是 如 何 被 激活 的 。auto 表示 XML 文件 被 解读 后 ,链接 自动 被 
激活 。 而 user 表示 该 链接 必须 被 用 户 手 动 激 活 , 也 就 是 用 户 必须 单 击 一 下 该 链接 。 
下 面 通过 XSL 将 这 个 XML 文件 在 浏览 器 中 显示 出 来 , 即 要 显示 上 述 XML 文档 中 
去 friendlink 过 元 素 所 标记 的 XML 超 链接 。friendlists. xsl 代码 清单 如 下 : 
<?xml version = "1.0"?> 
<xsl:stylesheet version = "1.0" xmlns:xsl = "http://www.w3.org/1999/XSLVTransform" 
xmlns:xlink = "http://www. w3. org/TR/xlink"> 
<xsl:output method = "html"/> 
<xsl:template match= "friendlink"> 
<xsl:if test = "@xlink:href"> 
<a href = "{@xlink:href}"><xsl:value — of select="."/></a> 
</xsl:if> 
</xsl:template> 
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</xsl:stylesheet > 
在 浏览 器 中 打开 myfriends. xml 文档 ,输出 结果 如 图 3-16 所 示 。 
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图 3-16 XML 中 的 超 链接 


2. XPointer 规范 


XML 文档 是 一 种 结构 化 文件 ,这 使 得 借助 文件 结构 进行 内 部 定位 成 为 可 能 ,这 就 是 
XPointer。XPointer 支持 在 XML 文件 中 定位 元 素 、 属 性 、 字 符 串 等 内 部 结构 ,例如 ,可 以 定 
位 到 根 元 素 或 者 当前 元 素 的 某 个 子 元 素 ,也 可 以 定位 到 文件 中 的 一 个 点 或 两 个 点 之 间 的 

XPointer 基于 XSL 转换 中 的 XPath 语言 ,并 在 其 基础 上 进行 了 扩展 ,包括 : 四 可 以 定 
位 节点 、 点 和 区 域 ; @ 通 过 字符 串 匹配 定位 资源 片段 ; @ 在 URI 引 用 中 定位 资源 片断 。 

由 于 XPointer 的 功能 是 文件 内 部 定位 ,因此 它 可 以 使 用 在 需要 定位 的 任何 地 方 , 例 如 
在 可 视 化 的 XML 编辑 器 中 定位 元 素 、 属 性 等 。 但 人 们 经 常 利用 XPointer 描述 XLink 链接 
的 目标 资源 ,因此 ,通常 将 XPointer 和 XLink 放 在 一 起 讨论 。 

XPointer 引用 的 基本 语法 为 : 


< linkelementname xlink:href = "xmlDdocument # xpointer(expression)"> text </linkelementname> 


其 中 ,在 # xpointer (expression ) 中 ,表达 式 expression 是 一 个 位 置 路 径 表达 式 , 和 
XPath 中 的 位 置 路 径 相 同 ,用 于 定位 计算 ,以 确定 被 链接 的 xml 文档 中 的 位 置 。 当 利用 id(" 
somelocation" ) 进 行 元 素 定位 时 ,表示 文件 中 ID 等 于 指定 常数 的 元 素 , 可 以 将 # xpointer(id 
(name) ) 简 写成 # name。 

例如 ,下 面 是 记录 个 人 信息 的 文档 personlists. xml, 定 义 了 多 个 人 的 信息 ,每 个 人 都 定 
义 了 id 属 性 。 

<?xml version= "1.0" encoding = "IS0— 8859—1"?> 

<personlist> 


<person id= "Jane"> 
<picture url = "http://127.0.0.1/jane. jpg" /> 
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</person> 
<person id= "Cherry"> 
<picture url = "http://127.0.0.1/Cherry. jpg" /> 


</person> 
</personlist> 
在 myfriends. xml 中 ,修改 二 friendlink 过 元素 ,可 以 直接 定位 到 一 个 具体 的 朋友 。 


例如 


< friend]link xmlns:xlink = "http://www.w3.org/TR/xlink" 
xlink:href = "http://127.0.0.1/ personlists. xml # Jane"> Jane</friendlink> 
即 可 定位 到 personlists. xml 文档 中 的 id 号 为 Jane 的 < person> 节 点 。 
XPointer 中 的 位 置 路 径 在 XPath 的 基础 上 进行 了 扩展 ,提供 了 5 种 不 同 的 在 XML 文 
件 内 定位 的 方法 ,包括 绝对 定位 ,相对 定位 ,范围 定位 .属性 定位 和 字符 串 定位 ,可 将 地 址 定 
位 到 相应 的 地 方 , 功 能 上 比 HTML 中 的 内 链接 更 为 强大 ,详细 介绍 略 。 


@.3 XML 开发 环境 XMLSpy 


XML 文档 是 一 种 纯 文本 文档 ,可 以 用 “记事 本 ”、UltraEdit 等 文本 编辑 软件 来 编辑 ,但 
是 非常 麻烦 , 且 无 法 进行 有 效 性 验证 。Altova XMLSpy 是 一 个 可 视 化 的 XML 编辑 和 开发 
环境 ,专门 用 于 设计 、 编 辑 和 调试 企业 级 的 基于 XML 技术 的 应 用 ,包括 XML、 XML 
Schema、XSL/XSLT、SOAP、WSDL 和 互联 网 服务 技术 ,同时 也 是 J2EE、. NET 和 数据 库 开 
发 人 员 不 可 缺少 的 高 性 能 的 开发 工具 ,可 以 大 大 提高 应 用 系统 的 开发 效率 。 


3.7.1 XMLSpy 简介 


Altova XMLSpy 是 工业 标准 的 XML 开发 环境 。XMLSpy 支持 下 列 功能 : 
(1) 创建 并 编辑 XML 实例 文档 ; 

(2) DTD 编辑 ; 

(3) XML Schema 开发 ; 

(4) XSLT 开发 和 调试 ; 

(5) XPath 开发 ; 

(6) XQuery 开发 和 调试 ; 

(7) WSDL 开发 ; 

(8) SOAP 开发 和 调试 ; 

(9) 数据 库 交 互 ; 

(10) Web 服务 开发 ; 

(11) Java/C#VC++ 代 码 生成 ; 

(12) VS. NET 和 Eclipse 集成 ; 

(13) 工程 管理 。 

Altova XMLSpy 有 多 个 不 同 的 版 本 ,其 最 新 版 为 Altova XMLSpy 2012 ,分 为 企业 版 和 


第 3 章 “HTML 和 XML 基础 


专业 版 两 种 版 本 。 专 业 版 提供 一 个 XML 开发 环境 ,包括 XML 文档 编辑 、 架 构 设 计 、 文 件 转 
换 与 调试 ,支持 XSLT、XQuery、databases、VS. NET 和 Eclipse 的 集成 等 。 企 业 版 还 具有 自 
动 代 码 生成 支持 Web 服务 等 功能 。 

关于 Altova XMLSpy 的 详细 信息 请 参考 其 官方 网 站 : http://www. xmlspy. com/ ,可 
以 下 载 30 天 软件 试用 版 ,本 书 将 以 Altova XMLSpy 2012 企业 中 文 版 为 例 ,简要 介绍 
XMLSpy 的 功能 及 使 用 方法 。 

首先 下 载 并 安装 XMLSpy 2012 企业 版 ,运行 XMLSpy, 显 示 XMLSpy 2012 企业 版 主 
界面 ,如 图 3-17 所 示 。 
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图 3-17 XMLSpy 2012 企业 版 中 文 主 界面 


XMLSpy 支持 XML、DTD、Schema、XSL、XSLT 等 多 种 文件 格式 的 编辑 器 。 它 可 以 将 
XML 展示 为 完美 的 树 形 结构 ,可 以 方便 地 使 用 各 种 HTML/XML/XSLT 标记 ,使 用 它 可 
以 大 大 节约 开发 时 间 , 不 必 把 大 量 的 时 间 浪 费 在 代码 的 输入 上 。 

下 面 通过 一 个 存储 电影 信息 的 实例 来 学 习 XMLSpy 的 简单 使 用 方法 。 设 计 三 个 文件 ; 
films. xml ,film. dtd 和 film. xslt。films. xml 负责 存储 具体 电影 内 容 数据 ,film. dtd 负责 对 
films. xml 进行 验证 ,而 film. xslt 则 负责 对 films. xml 进行 样式 变换 ,确定 它 在 浏览 器 中 的 
最 终 显 示 效 果 。 


3.7.2 创建 dtd 文档 
下 面 是 我 们 要 创建 的 数据 类 型 文件 films. dtd 的 代码 : 


<?xml version = "1.0" encoding = "GB2312"?> 
<!ELEMENT movies (movie* )> 
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<!ELEMENT movie (name,actor, time)> 
<!ATTLIST movie filmid CDATA #REQUIRED> 
<! ELEMENT name ( # PCDATA)> 

<! ELEMENT actor ( 井 PCDRTR)> 

<! ELEMENT time ( #PCDATA)> 


要 创建 上 述 films. dtd 文档 ,具体 步骤 如 下 。 
1. 建立 根 节点 movies 


(1) 在 XMLSpy 中 ,选择 “文件 ”一 “新 建 "命令 ,打开 “创建 新 文件 ”对 话 框 ,如 图 3-18 
所 示 。 


Active Server Page 
BizTalk Schena 

mL Chenical Narkwp Langusge 
Cascading Style Sheet 


Docunent Content Description 
NS Office Yord OpenXWL 


External Entity 
Tormatting Objects 
HTNL 4 

JIWL 5 

XHTML 1.0 Strict 
XHTNL 1.0 Transitional 


图 3-18 XMLSpy“ 创 建新 文件 ”对 话 框 


(2) 在 文件 类 型 列表 中 ,选择 dtd Document Type Definition, 单 击 “ 确 定 ” 按 钮 ,新 建 一 
个 空 的 dtd 文档 并 在 编辑 区 打开 ,如 图 3-19 所 示 。 
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(3) 修改 编码 方式 项 encoding 默认 值 UTF-8 ,将 其 改 为 GB2312。 在 编辑 区 ,选择 “网 
格 ”, 切 换 到 网 格 视图 ,如 图 3-20 所 示 。 
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图 3-20 dtd 文档 编辑 界面 网 格 视图 


(4) 网 格 视图 是 一 种 设计 视图 , 左 侧 是 元 素 列表 , 右 侧 是 元 素 定 义 , 中 间 的 分 隔 线 可 以 
左右 拖 动 。 当 新 建 一 个 dtd 文件 后 ,XMLSpy 系统 自动 创建 一 个 EMPTY 元 素 ,并 给 元 素 
一 个 默认 名 , 即 “ENTER_NAME_OF_ROOT_ELEMENT_HERE”。 在 该 默认 名 上 双击 ， 
元 素 名 进入 编辑 状态 ,输入 movies 作为 元 素 名 。 这 样 根 节点 movies 就 建立 完毕 。 


2. 定义 根 节 点 movies 元 素 


(1) 根据 文件 film. dtd 的 设计 ,元 素 二 movies 二 为 一 个 复杂 元 素 ,由 0 个 或 多 个 
一 movie 二 元 素 组 成 。 双 击 右 侧 “ 元 素 ” 窗 格 中 的 sequence of ,结果 如 图 3-21 所 示 。 

(2) 接 下 来 进行 二 movies 过 的 定义 。 在 Elm 中 输入 子 元 素 名 二 movie 记 ,, 然 后 单 击 元 
素 名 右 侧 区 域 , 在 “属性 ” 窗 格 中 ,双击 “0 or more”, 如 图 3-22 所 示 。 

(3) 至 此 , 根 元 素 二 movies 一 定义 完成 。 单 击 “ 文 字 ” 视 图 ,可 以 看 到 生成 的 代码 ,如 下 : 


<!ELEMENT movies (movie* )> 


3. 定义 二 movie 二 元 素 


(1) 在 二 movies 之 元 素 上 右 击 , 在 快捷 菜单 中 选择 “追加 ”一 “Ele 要 素 ” 命 令 , 则 在 
所 movies 二 下 面 添 加 一 个 新 的 元 素 , 如 图 3-23 所 示 。 

(2) 在 新 元 素 名 称 段 双击 ,输入 元 素 名 <movie>, 默 认 的 元 素 定 义 为 "# PCDATA”, 双 
击 , 在 右 侧 "元 素 ” 窗 格 ,双击 sequence of ,如 图 3-24 所 示 。 
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图 3-21 根 节点 sequence 属性 
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图 3-22 根 节点 二 movies 二 的 定义 


(3) 在 元 素 二 movie 之 上 输入 第 一 个 子 元 素 王 name 二 ,然后 执行 两 次 “添加 子 元 素 ” 一 
“Elm 要 素 ” 命 令 ,为 二 movie> 元 素 增 加 两 个 子 元素 ,分 别 输入 子 元 素 名 字 actor 和 time。 
(4) 为 二 movie 二 填 加 属性 ,在 元 素 一 movie 二 > 上 右 击 ,选择 “追加 ”一 “Att 属性 列表 ” 命 
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图 3-23 追加 新 元 素 
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图 3-24 ”编辑 一 movie> 元 素 


令 , 在 二 movie 记 元 素 后 面 ,在 填 加 元 素 属 性 编辑 区 .输入 要 为 其 定义 属性 的 元 素 名 ,此 时 为 
二 movie ,在 列表 中 依次 输入 属性 的 名 字 、 类 型 和 取 值 ,结果 如 图 3-25 所 示 。 

(5) 至 此 ,元 素 二 movie 二 定义 完成 了 。 此 时 , 单 击 “ 文 字 ”, 切 换 到 dtd 编辑 的 文字 视 
图 ,可 以 看 到 生成 的 dtd 定义 文本 。 
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3-25 ”元素 二 movies 之 的 定义 


4. 定义 元 素 二 name>、 一 actor> 、. 一 time 


(1) 在 网 格 视 图 ,在 元 素 二 movie 盖 节点 上 右 击 ,在 快捷 菜单 中 选择 “追加 ”~”“Ele 要 素 ” 
命令 ,在 列表 中 ,自动 增加 一 个 新 的 元 素 节 点 ,如 图 3-26 所 示 。 
$9 Altova INLSpy [Vntitledl. ata #] EE 本 Rn 
BEL 因 工具 由 钾 口 如 攻 助 如 


mt Type [Mt Valves [ms Presence [Mx Default 
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(2) 在 新 增 元 素 节点 , 单 击 名 称 区 ,可 以 输入 元 素 名 称 , 元 素 类 型 默认 为 #PCDATA, 单 
击 该 处 ,可 以 从 右 侧 的 “元 素 ” 窗 格 列表 中 ,选择 新 的 类 型 ,如 果 是 复杂 元 素 ,应 单 击 sequence 
of。 此 处 ,根据 films. dtd 设计 ,输入 元 素 名 为 name. 类 型 为 “#PCDATA”。 

(3) 按照 上 述 步骤 ,依次 填 加 元 素 actor 和 time, 结 果 如 图 3-27 所 示 。 
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图 3-27 设计 完成 的 dtd 网 格 视图 


这 样 DTD 文档 就 建立 好 了 。 
在 “文字 ”视图 下 可 以 查看 编辑 所 得 到 的 dtd 源 代码 ,如 图 3-28 所 示 。 
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3-28 ”编辑 完成 后 生成 的 dtd 代码 
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SA 


(4) 最 后 保存 文件 。 选 择 “ 文 件 ” 一 “保存 ”命令 ,打开 “保存 ”对 话 框 ,输入 文件 名 
films. dtd。 


3.7.3 创建 基于 dtd 验证 的 实例 文档 
电影 文档 films. xml 代码 清单 如 下 : 


<?xml version = "1.0" encoding = "GB2312"?> 
<!DOCTYPE movies SYSTEM "films. dtd"> 

<?xml — stylesheet type = "text/xsl" href = "film. xslt"?> 
<movies> 

<movie filmid= "file 一 g1001"> 

<name> 红 高 粱 </name> 

<actor > 巩俐 </actor > 

<time> 1987 </time > 

<movie filmid= "file— g1002"> 

<name> 大 红 灯 笼 高 高 挂 </name> 

<actor > 巩俐 </actor> 

<time> 1992 </time> 

</movies > 


具体 操作 步骤 如 下 。 

(1) 选择 文件” 新建” 命令 ,打开 * 创 建新 文件 ”对话 框 ( 图 3-18) ,选择 里 面 的 xml 
(XML Document) ,此 时 会 弹出 一 个 对 话 框 , 要 求 选 择 XML 文档 的 验证 方式 是 DTD 还 是 
Schema, 如 图 3-29 所 示 。 


新 建文 件 .21x 
如 果 你 想 基于 某 个 schema 或 DTD 来 创建 一 个 新 的 XML 文档 
的 这 和 人 本 让 到 的 休 正 确 的 分 泊 - 在 这 种 全 史 下 请 
ee 取消 | 
cp 
© schema 


否则 请 单 击 " 职 消 "按钮 来 以 空 文档 开始 。 


图 3-29 选择 验证 类 型 


(2) 选择 DTD 验证 方式 , 单 击 “ 确 定 ” 按 钮 。 然 后 选择 刚刚 创建 的 films. dtd 作为 其 验 
证 文档 , 单 击 “ 确 定 ” 按 钮 。XMLSpy 将 自动 建立 一 个 符合 films. dtd 验证 的 XML 空白 文 
档 ,如 图 3-30 所 示 。 

(3) 将 编码 方式 encoding 更改 为 GB 2312 ,然后 输入 XML 文档 内 容 。 如 果 内 容 是 已 
经 编辑 过 的 ,可 以 直接 复制 ,然后 在 工具 栏 中 单 击 “ 美 编 " 按 钮 图 ,形成 规范 化 的 锯齿 
结构 。 

(4) 如 果 要 一 步 步 地 创建 XML 文档 ,切换 到 “网 格 " 视 图 , 即 设计 视图 ,如 图 3-31 所 示 。 

(5) 单 击 根 元 素 二 movies 二 ,在 右 侧 的 “元 素 ” 窗 格 , 根 据 films. dtd 的 定义 ,二 movies 二 
有 若干 个 二 movie 二 子 元素 , 因 此 ,选择 “添加 子 元 素 ” 选 项 卡 ,显示 “()movie”, 双 击 该 子 元 
素 , 则 在 二 movies 过 元素 节点 下 ,添加 一 个 子 元 素 节 点 ,如 图 3-32 所 示 。 
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图 3-31 XML 文档 网 格 视图 


(6) 在 二 movie 二 元 素 节 点 ,依次 输入 filmid、name、actor 和 time。 然 后 ,再 次 单 击 
二 movie 记 元 素 节点 ,在 右 侧 的 “元 素 " 窗 格 , 单 击 “ 添 加 子 元 素 ”, 再 次 双击 “()movie”, 添 加 
第 二 个 二 movie 二 元 素 , 再 次 输入 元 素 的 内 容 ,结果 如 图 3-33 所 示 。 
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图 3-32 添加 一 个 二 movie 二 子 元 素 
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3-33 ”添加 两 个 二 movie 二 子 元 素 的 结果 


(7) 切换 到 “文字 ”视图 ,可 以 看 到 ,生成 的 XML 文档 如 图 3-34 所 示 。 
(8) 选择 XML 一 “检查 良 构 性 ”>“ 验 证 XML” 命 令 , 对 输入 的 XML 实例 文档 进行 有 效 
性 验证 ,看 其 是 否 符 合 dtd 定义 。XML 文档 终于 编辑 完毕 , 单 击 “ 保 存 ” 按 钮 ,将 文档 保存 为 


films. xml。 
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| <time>1987¢/time> 
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9 9 novie filnid"gonglil992"> 
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| 《actor> 巩 俐 </actor> 

<time>1992</tine> 
/novie> 
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图 3-34 编辑 后 的 xml 实例 文档 


3.7.4 创建 XML 模式 文档 


XML Schema 可 以 定义 元 素 及 其 类 型 ,通过 Schema 可 以 构建 数据 模型 ,来 约束 数据 存 
储 和 交换 ,以 及 实现 数据 的 合法 性 校 验 。 我 们 可 能 注意 到 ,对 于 一 个 XML 文档 (可 以 看 做 
一 个 XML Schema 的 实例 ) ,即使 它 引用 了 一 个 Schema, 当 在 浏览 器 中 打开 这 个 XML 文档 
时 ,其 存储 的 数据 和 Schema 不 一 致 : 也 不 会 报错 ,这 似乎 不 符合 XML Schema 最 初 的 设计 
思想 。 为 什么 呢 ? 因为 浏览 器 只 检查 XML 文档 的 格式 ,并 不 进行 数据 合法 性 的 检查 。 要 
检查 XML 文档 数据 的 合法 性 ,需要 使 用 XMLSpy。 


1. 数据 模型 
下 面 通过 一 个 例子 说 明 XML Schema 文档 的 设计 和 创作 过 程 。 假 设 对 于 图 书信 息 建 
立 下 面 的 数据 模型 。 


图 书信 息 Schema, 代 码 清单 如 下 (文档 名 books. xsd): 


<?xml version = "1.0" encoding = "gb2312"?> 
<xs: schema xmlns: xs = "http://www. w3. org/2001/XMLSchema" elementFormDefault = " qualified" 
attributeFormDefault = "unqualified"> 
<xs:element name = "catalog" type = "CatalogData"/> 
<xs:complexType name = "CatalogData"> 
<xs:sequence> 
<xs:element name = "book" type = "bookdata" minOccurs = "0" maxOccurs = "unbounded"/> 
</xs:sequence> 
</xs:complexType > 
<xs:complexType name = "bookdata"> 
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<xs:sequence> 
<xs:element name = "title" type= "xs:string"/> 
<xs:element name = "author" type = "xs:string"/> 
<xs:element name = "publisher" type= "xs:string"/> 
<xs:element name = "publishdate" type = "xs:date"/> 
</xs:sequence> 
<xs:attribute name = "isbn" type= "xs:string"/> 
</xs:complexType > 
</xs:schema > 


2. 建 模 过 程 


下 面 是 利用 XMLSpy 的 基本 过 程 。 

1) 新 建 XML Schema 文件 

在 XMLSpy 中 ,选择 “文件 ”>“ 新 建 " 命 令 , 打 开 “ 创 建新 文档 ”对 话 框 ; 从 文件 类 型 列 
表 中 选择 xsd W3C XML Schema, 创 建 一 个 新 的 xsd 文档 ,如 图 3-35 所 示 。 


Altove ZNLSpy - [Vntitled5. xsa] 
可 X 作 加 旭 纺 (人 B 项目 (四 J 0 DTD/ 模 式 (3) 模式 设计 00 XSL/X8uery (四 huthentie (如 数据 库 (D) 狼 换 (C) 视 国 (9 
出 归 各 ( WSIL (SQAP XBML 国 工 A 人 D 军 D (二 可 助 (0 -ax 


ENTER RAE OF_ROOT_ELEMENT._HERE” > 
9 | 。 xs:annotation> 
| | 。 《xssdocumentation?Comment describing your root elenent</xs:docunentation) 
《xssarmat ationy 


0 生 

人) 2 :yAttribute 
() xs: appinfo 

《》 xs:attribute 

《) xs:attributeGroup 
(> 
(> 


/xsxelenert》 in 


es xs:complexContent 


人》 xs: complexType 

() xs: docunentation 
《) xs: elenent 

() xs: enuneration 

(0) xs:field 

() xs:fractionDigits 
() xs: group 

() xs:import 


届 性 


mameuw oo- 


[文字 | | 机 WSDL | XeRL Authentice 浏览 器 


名 mtueus.xsa 
信息 x 
区 EREEREEER 

信息 | Path | XST 概 要 | 在 文 作 旺 坦 履 | 在 模式 中 查 伟 | 在 7 证 里 查 贱 | 团 


LSpy Enterprise Edition v2012 spt 。 广 骨 到 ao (sdu) 。 po1938-2011 Altova GabH 


图 3-35 新建 XML Schema 文档 


新 建 一 个 W3C XML Schema 文档 时 ,XMLSpy 会 自动 创建 一 个 元 素 , 名 字 为 默认 的 
ENTER_NAME_OF_ROOT_ELEMENT_HERE, 这 个 元 素 尽 量 不 要 删除 ,即使 你 想 把 已 
经 编辑 好 的 xsd 文档 复制 过 来 ,此 时 应 该 复制 到 这 个 默认 元 素 的 下 面 , 将 代码 清单 book. xsd 
复制 到 编辑 区 ,然后 在 工具 栏 中 单 击 “ 美 编 ? 按 钮 。 

2) xsd 文件 设计 

如 果 要 从 头 设计 , 单 击 * 网 格 ” ,打开 设计 视图 .或 者 按照 代码 清单 的 内 容 一 步 步 地 建立 
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MA 


books. xsd ,如 图 3-36 所 示 。 


ET I8LSpy - [heoks-xsd = 


国文 人 四 编 各 加 项 目 外 x 有 EL GO IT 模式 GE) 模式 设计 四 XSL/XQuery @) huathentie () 
数据 库 @) 转换 C) 视图 WW) 浏览 器 @) 0 0 -gx 


rs-element 7 alog 
本 rs-cemplezTyPe hane-CataloEhate 
所 


图 weoks. xsa * 


一 新 图 | 路 盖 _| 改变 类 型 | 改变 外 观 | 选择 数据 | 和 输出 ， 3 EE| 


加 


信息 | 好 ath | xsL 撤 要 | 在 文件 里 查找 | 在 模式 中 查找 | 在 XBRL 里 查找 | 图 
XMLSpy Enterprise Edition v2012 spl _ 注册 到 hao (sdu) ©1998-2011 Altova Gnb} 


图 3-36 ”编辑 xsd 模式 文件 


在 网 格 窗口 ,编辑 区 列 出 了 已 有 的 类 型 .元素 等 ,此 时 ,在 右 侧 的 “元 素 ” 窗 格 “ 属 性 " 窗 
格 , 列 出 了 当前 可 以 新 建 的 项 目 ,包括 简单 数据 理性 、 复 杂 类 型 组、 元 素 等 ,双击 即 可 添加 新 
的 项 目 。 

设计 完成 后 ,可 以 切换 到 “文字 ”视图 ,查看 生成 的 xsd 代码 , 当 编 辑 完成 后 ,选择 “文件 ”一 
“保存 ”命令 ,将 xsd 文件 保存 为 books. xsd。 


3.7.5 ”新 建 基于 模式 验证 的 实例 文档 


选择 “文件 ”>“ 新 建 " 命 令 , 打 开 “ 创 建新 文件 ”对 话 框 ; 从 文件 类 型 列表 中 选择 xml 
eXtensional Markup Languagge, 弹 出 “新 建文 件 " 对 话 框 (图 3-18) ,从 中 选择 Schema, 单 击 
“确定 ”按钮 。 然 后 ,打开 模式 文件 选择 对 话 框 ,选择 要 应 用 的 模式 文件 books. xsd, 单 击 “ 确 
定 ” 按 钮 。 

当选 择 模 式 文件 (xsd) 后 ,如 果 模 式 文件 中 ,在 一 schema 二 元 素 内 包含 多 个 元 素 , 则 显 
示 * 选 择 根 元 素 "对 话 框 ,里 面 列 出 模式 文件 中 过 schema 盖 元 素 内 声明 的 所 有 元 素 , 此 时 选 
择 我 们 设计 的 二 catalog 二 作为 根 元 素 ,自动 新 建 一 个 xml 实例 文档 框架 ,文档 根 为 
到 catalog 二 ,如 图 3-37 所 示 。 

在 编辑 区 的 下 方 , 单 击 “ 网 格 ”, 切 换 到 网 格 视图 ,如 图 3-38 所 示 。 

在 网 格 视图 ,可 以 看 到 目前 只 有 一 个 根 节点 过 catalog 二 , 它 只 有 两 个 属性 ,没有 内 容 。 
单 击 其 中 的 一 个 属性 ,在 右 侧 “元素 ” 窗 格 ,显示 应 用 模式 的 books. xsd 中 二 catalog 过 元素 可 
包含 的 内 容 列表 ,根据 books. xsd 的 定义 ,此 时 只 有 一 个 二 book 二 元 素 。 在 “元 素 ” 窗 格 中 ， 
双击 “()book”, 则 在 二 catalog 二 元 素 中 增加 一 个 二 book 记 。 
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Altora XNLSpy - [Unatitled9. zml #] |Dlxl 


加 文件 四 编 加 四 项目 四 XIL 有 DTD/ 模 式 G) 模式 设计 轨 。 XSLXQuery @， hnthentic 和 ) 数据 库 四 ) 
转换 CC) 视图 加 浏览 器 的 WSIL 人 so 3XBRL 人 工具 四 窗口 如 帮助 四 


ncoding="UIF-8"?> 
3. org/2001/XML Schena-instance” 
books. xsd”/> 


() catalog 
《> ENTER_NAME_OF_ROOT_ELENMENT, 


|| [Et anp 上 四 下 


信息 | Eastk | XSI 损 要 | 在 文件 时 查找 | 在 模式 中 查找 | 在 XB 里 查找 | 图 "本 妨 
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图 3-37 新建 xml 实例 文档 


y - [Untitledg. zml #] =| 吕 | x| 
加 文件 四 编辑 E) 项 目 人 XHL WO) DTD/ 模 式 G) 模式 设计 多 XSLXQuery @) Authentie (A) 数据 库 @) 
转换 EC) 视图 浏览 器 @) WsDL 0) SOAP XBRL @) 工具 名 窗口 人 帮助 0 x 
A I A et 


IME 
三 version Lo 
| = encoding GB2312 Woon 


http://wwew. w3. org/2001/XMLSchena-instance 


i catalog 


到 | 追加 | 插入 | 添加 子 元 素 
加 re 
属性 he 


文字 [网 格 | 模式 | WsDL xBRL Authentic 浏览 器 
Be 1 
信息 x 


CA TEST 
实体 nx 


|| re a 
信息 | XPath | XSI 报 要 | 在 文件 里 查找 | 在 模式 中 查找 | 在 XBRL 里 查找 | 图 追加 「 插入 | 过 加 子 元 素 
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图 3-38 ”xml 实例 文档 网 格 视图 


单 击 新 添加 的 二 book 二 元 素 ,在 “属性 " 窗 格 中 ,选择 “添加 子 元 素 ” 选 项 卡 , 列 出 二 book 二 
元 素 可 以 添加 的 属性 ,双击 isbn, 如 图 3-39 所 示 。 
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图 3-39 在 根 下 填 加 元 素 及 为 元 素 添加 属性 


在 二 book 二 元 素 中 ,在 每 一 列 下 输入 相应 的 内 容 ( 属 性 列 必 须 输 入 值 ) , 单 击 * 文 本 ”, 选 
择 文本 视图 ,可 以 看 到 生成 的 XML 代码 ,如 图 3-40 所 示 。 


Altora [Untitled10. xml #] =Io|xl 
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5 《author> 郝 兴 伟 </ author》 
6 《publisher)》 清 华 大 学 出 版 社 人 /publisher> 
7 
8 
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<publishdate>2009-11-17¢/publishdate> 
/book> 
/catalog> 
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3-40 ”生成 的 XML 文档 代码 
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选择 XMIL* 验 证 有 效 性 F8” 命 令 ,文档 有 效 。 修 改 日 期 数据 为 不 符合 日 期 格式 的 串 , 按 
F8 键 ,再 次 验证 , 则 系统 检测 到 无 效 数据 ,并 报错 。 


3.7.6 创建 XSLT 文档 


当 XML 实例 文档 完成 后 ,如 果 要 进行 格式 化 输出 ,还 需要 建立 XML 扩展 样式 文档 , 即 
xsl 文档 。 假 设 要 输出 films. xml 的 内 容 , 设 计 的 XSLT 文档 代码 如 下 : 


<?xml version = "1.0" encoding = "gb2312"?> 
<xsl:stylesheet version = "1.0" xmlns:xsl = "http://www.w3.org/1999/XSL/Transform"> 
<xsl:output method = "xml" version= "1.0" encoding = "GB2312" indent = "yes"/> 
<xsl:template match = "/"> 
< htm]l > 
<body> 
<xsl:apply — templates select = "movies"/> 
</body> 
</html > 
</xsl:template> 
<xsl:template match= "movies"> 
<p align = "center"> 巩 俐 代表 作 </p> 
<table border = "1" width= "400" bgcolor = "#CCFFCC"> 
<tr> 
<td> 名 称 </td> 
<td> 时 间 </td> 
</tr> 
<xsl:for - each select = "movie"> 
<tr> 
<td><xsl:value- of select = "name"></xsl:value— of ></td> 
<td><xsl:value — of select = "time"></xsl:value— of ></td> 
</tr> 
</xsl:for - each> 
</table> 
</xsl:template> 
</xsl:stylesheet > 


下 面 是 利用 XMLSpy 创建 xsl 文档 的 基本 过 程 。 

(1) 选择 “文件 ”一 “新 建 ”命令 ,打开 “创建 新 文件 ”对 话 框 ,选择 里 面 最 后 一 项 xslt 
(Extensible Stylesheet Language) ,打开 “创建 新 XSL/XSLT 文件 ”对 话 框 ; 选择 “通用 
XSL/XSLT”, 单 击 “ 确 定 ” 按 钮 ,建立 的 新 xslt 文件 ,如 图 3-41 所 示 。 

(2) 编辑 xslt 文件 。 将 其 编码 方式 改 为 GB 2312, 编 辑 设计 的 xslt 文档 ,或 直接 复制 。 
完成 后 的 编辑 页 面 如 图 3-42 所 示 。 

添加 完毕 ,设置 相应 的 节点 为 各 元 素 的 属性 值 即 可 完成 XSLT 文档 的 编写 。 选 择 “ 文 
件 ”>“ 保 存 ” 命 令 ,设置 文 件 名 为 films. xslt。 

(3) XML 实例 文档 films. xml, 应 用 films. xmlt 输出 。 

在 编辑 区 底部 , 单 击 films. xml 标签 ,切换 到 films. xml 文档 编辑 状态 ,选择 XSL/ 
XQuery 习 “指定 XSL” 命 令 , 在 弹出 窗口 中 选择 films. xslt 文件 , 单 击 “ 确 定 ” 按 钮 , 则 在 xml 
文档 的 头 部 , 填 加 如 下 处 理 指令 : 
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模 起 设计 加。 XSL/AXQuery 加 inthentic ( 遇 。 数 握 库 (四 
工 R 四 音 D 国 帮助 人 0 a 


"1.0" encoding="UTF-8"?> 
Cxsl:stylesheet version="2.0" xmlns:xsl=" 
http://www. w3. org/1999/X5L/Transforn” xnlns:xs=" 
http://www. w3. org/2001/XNL Schena” xnlns:fr=” 
http://ww. w3. org/2005/xpath-functions” > 
utput method="xml” version="1.0” encoding="UTF-8" 
yes /7 
/xsl:stylesheet> 


Altors TaLSpy - [fils: 


“gb2312" ?> 


- <xsl:stylesheet version="2.0" 
ttp:/ /www.w3.org/1999/XSL/Transform" 


"http:/ /www.w3.org/2001/XMLSchema" 
http:/ /www.w3.0rg/2005/xpath-functions"> 


<xsl:output method="xml" version="1.0" encoding="gb2312" indent="yes" /> 


- <xsl:template match="/"> 
- <html> 
- <body> 
<xsl:apply-templates select="movies" /> 
</body> 
</html> 
</xsl;template> 
-<xsl:template match="movies"> 
<p align="center"> 英 俐 代表 作 </p> 
- <table border="1" width="400* bgcolor="#CCFFCC"> 
-<tr> 
<td algn="center"> 名 称 </td> 
<td align="center'> 时 间 </td> 
</tr> 


~ <xsl:for-each selec 


3-42 xslt 文 件 
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<?xml - stylesheet type = "text/xsl" href = "films.xslt"?> 


(4) 查看 films. xml 显示 效果 。 在 films. xml 编辑 状态 , 单 击 编辑 区 下 方 的 “浏览 器 ”， 
即 可 预览 当前 文档 的 输出 效果 。 也 可 以 直接 使 用 浏览 器 打开 films. xml 查看 。 如 果 想 输出 
变换 结果 文档 ,在 XMLSpy 中 变换 后 单 击 将 结果 文档 存盘 即 可 。 最 终 显示 效果 如 图 3-43 
所 示 。 


恒 E: \ 教 材 --Teb 技 术 导 论 (第 3 版 )\Eilws-xal ~ Wicsasase ste 加 [= EE 
文件 四 ”编辑 中 查看 WW 收藏 人 工具 中 帮助 加) | 多 
RE ET 
地 让 加 [< 5 \ 教 计 --fet 技 术 S 论 第 3 版)\fi1:.xal ”加 | 固 和 | 活 接 ” 


图 3-43 ”films. xml 实例 文档 在 浏览 器 中 的 显示 结果 


体 章 小 结 


本 章 首先 介绍 了 标记 语言 的 概念 ,产生 和 发 展 , 对 几 种 常见 的 标记 语言 进行 了 简要 说 
明 ,并 分 析 了 它们 的 定位 和 不 同 。 然 后 重点 讲解 了 HTML 规范 ,特别 是 CSS 技术 和 图 层 两 
大 核心 技术 ,特别 讲解 了 改变 标记 默认 显示 样式 的 不 同方 法 、 各 自 的 优 缺 点 、 块 元 素 和 行内 
元 素 的 概念 .图 层 和 所 span 盖 的 出 发 点 和 应 用 。 对 于 XML, 讲 解 了 XML 的 语法 和 定位 , 重 
点 讲解 了 XML DTD、XML 模式 技术 ,对 W3C xsd 预定 义 元 素 和 内 置 数据 类 型 进行 了 列表 
总 结 ,使 得 大 家 能 够 进行 XML 模式 文档 的 定义 。 随 后 对 XSL、XPath、XQuery 等 相关 
XML 技术 进行 了 简要 介绍 ,并 讲解 了 它们 和 xml 实例 文档 的 关系 ,以 及 它们 之 间 的 关系 。 
最 后 介绍 了 XML 开发 工具 XMLSpy 的 功能 和 使 用 ,并 给 出 了 大 量 的 案例 。 


名 是 3 


一 、 简 答题 

1. 什么 是 HTML? 简 述 HTML 文档 的 基本 结构 。 

2. 关于 HTML 标记 ,回答 下 列 问题 : 

(1) 标记 的 属性 是 如 何 分 类 的 ? 有 何 区 别 ? 

(2) 不 同 的 标记 ,具有 的 属性 也 不 相同 .列举 几 个 大 部 分 标记 都 具有 的 一 般 属 性 ,并 说 
明 这 些 属性 的 作用 。 

(3) 要 修改 标记 的 默认 显示 属性 ,有 哪 几 种 方法 ? 
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(4) 用 id 属性 和 class 属性 都 可 以 修改 标记 显示 样式 ,两 者 有 何 区 别 ? 

3. 简 述 HTML 中 表单 二 form 之 标记 的 target 属性 的 作用 。 

4. 什么 是 层 秋 样 式 表 (CSS)? 使 用 CSS 有 什么 好 处 ? 

5. XML 与 HTML 相 比 有 什么 本 质 不 同 ? 

6. 一 个 XML 文档 有 哪 几 个 组 成 部 分 ? 简 述 每 一 部 分 的 功能 。 

7. 在 XML 文档 中 ,文档 类 型 定义 (DTD) 和 文档 架构 的 目的 是 什么 ? 

8. XML 技术 实现 了 数据 和 显示 的 分 离 , 关 于 XML 文档 内 容 的 显示 ,回答 下 列 问题 : 
(1) 如 果 不 声明 xml 文档 的 显示 样式 ,在 浏览 器 中 加 载 一 个 xml 文档 时 ,显示 的 结果 是 


(2) xml 文档 树 显 示 了 文档 数据 的 结构 ,如 何 进行 xml 文档 的 格式 化 显示 ? 

9. 在 XML Schema, 完 成 下 列 简 单数 据 类 型 的 定义 。 

(1) 声明 一 个 带 有 约束 的 简单 类 型 元 素 "age”,age 的 值 不 能 大 于 0 小 于 100。 

(2) 定义 了 一 个 带 有 约束 的 简单 类 型 元 素 "postcode" ,长 度 为 5 个 数字 字符 的 串 。 

(3) 定义 了 一 个 带 有 约束 的 简单 类 型 "sextype" , 取 值 为 * 男 | 女 |male|female”。 

(4) 定义 一 个 复杂 数据 类 型 nametype, 包 括 名 和 姓 。 

(5) 扩展 数据 类 型 nametype, 新 建 复杂 数据 类 型 元 素 fullname, 包括 新 的 元 素 
nickname。 
10. 在 W3C XML Schema 定义 语言 中 ,一 any 二 元 素 和 一 anyAttribute 过 的 用 途 是 什 
举例 说 明 。 
11. 编写 关于 客户 资料 的 Schema, 用 XMLSpy 检验 编写 的 XML 文件 的 有 效 性 。 
12. 在 XML 技术 中 ,相关 的 规范 和 标准 较 多 ,回答 下 列 问 题 : 
(1) 什么 是 XSL? XSL 和 XML 是 一 种 什么 样 的 关系 。 
(2) 什么 是 XPath 和 XQuery? 它们 之 间 是 什么 关系 ? XPath 和 XSL 有 什么 关系 ? 
13. 有 一 个 网 上 购物 站 点 ,针对 图 书 类 商品 ,包含 下 列 信息 : 封面 图 片 、 书 名 、 作 者 、 出 
版 社 .出 版 日 期 价格 。 要 求 : 

(1) 编写 一 个 XML 文档 ,来 描述 图 书 类 商品 ,要 求 对 于 “封面 图 片 ”定义 一 个 图 片 超 链 
接 元 素 。 

(2) 编写 对 应 的 xsl 文件 ,完成 图 书 xml 文档 的 显示 。 

14. 对 于 XML 文档 ,什么 是 结构 良好 (well formed) ,其 主要 特征 是 什么 ?7 什么 是 文档 
数据 的 有 效 性 ? 

15. 关于 Altova XMLSpy, 回 答 下 列 问题 。 

(1) 软件 有 哪些 典型 功能 ? 

(2) 如 何 验 证 一 个 XML 文档 的 结构 良好 和 数据 有 效 性 ? 

(3) 在 工具 栏 中 ,“ 美 编 * 工 具 按 钮 的 功能 是 什么 ? 

二 、 阅 读 理 解 题 

1. 在 CSS 中 ,提供 了 一 组 定位 属性 ,可 以 对 块 级 元 素 和 行内 元 素 进 行 定位 ,改变 正常 的 
输出 流 结果 ,阅读 下 列 代码 ,说明 其 输出 结果 

(1) 块 级 元 素 的 相对 定位 : 


< html > 


么 
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<head> 

< style type = "text/css"> 

Pp.pos_left {position:relative; left: — 20px} 

</style> 

</head> 

<body> 

<p> 段 落 的 正常 输出 位 置 </p> 

<p class = "pos_left"> 段 落 在 输出 时 相对 于 其 正常 位 置 向 左 移动 </p> 
<p> 相 对 定位 会 按照 元 素 的 原始 位 置 对 该 元 素 进行 移动 </p> 
</body> 

</html > 


(2) 块 级 元 素 的 绝对 定位 : 


<html> 
<head> 
<style type = "text/css"> 
hl.pos_abs{position:absolute; left:100px; top:150px} 
img{ 

position:absolute; 

bottom: Opx 
} 
</style> 
</head> 
<body> 
<hl class = "pos_abs"> 这 是 带 有 绝对 定位 的 标题 </hl > 
<p> 通 过 绝对 定位 ,元 素 可 以 放置 到 页 面 上 的 任何 位 置 </p> 
< img class = "normal" src = "images/smile.gif" /> 
</body> 
</html > 


(3) 在 文本 中 垂直 排列 图 像 : 


<html > 


<head> 

< style type = "text/css"> 

img. top {vertical - align:text 一 top} 

img. bottom {vertical - align:text - bottom} 

</style> 

</head> 

<body> 

<p> 图 片 与 文字 < img class = "top" border = "0" src = "images/smile.gif" /> 上 重 齐 </p> 
<p> 图 片 与 文字 < img class = "bottom" border = "0" src = " images/smile. gif" /> 下 重 齐 </p> 
</body> 

</html > 


(4) 元 素 的 摆 放 顺序 : 


<html> 
<head> 
< style type = "text/css"> 
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img. x{position:absolute; left:0px; top:0px;z— index: — 1} 

</style> 

</head> 

<body> 

<hl > 这 是 一 个 标题 </hl > 

< img class = "x" src = "images/smile. jpg" /> 

<p>z- index 的 默认 值 0,z- index: -1 拥有 更 低 的 优先 级 ,将 作为 背景 </p> 
</body> 

</html > 


2. 在 HTML 中 ,经 常 使 用 div、span 元 素 , 并 结合 CSS 的 定位 、 浮 动 属性 ,实现 特定 的 
输出 效果 。 阅 读 下 列 代码 ,说明 运行 结果 。 
(1) 图 层 的 浮动 : 


<html> 
<head> 
<style type = "text/css"> 
div{ 
margin:0 0 15px 20px; 
border:1px solid black; 
width:100px; 
padding:15px; 
text - align:center; 
float:right 
} 
</style> 
</head> 
<body> 
<div> 
< img src = "images/mydog. gif" /><br /> 
my dog 
</div> 
<p> 
在 该 段落 中 , div 元 素 的 宽度 是 100 像素 , 它 其 中 包含 图 像 . div 元 素 浮动 到 右 侧 . 同时 , div 元 素 添 加 
了 外 边 距 , 使 div 与 文本 保持 一 个 距离 ,此 外 ,还 向 div 添加 了 边框 和 内 边 距 。 
</p> 
</body> 
</html > 


(2) 段落 的 首 字母 浮动 于 左 侧 : 


<html> 
<head> 
<style type= "text/css"> 
span 
{ 
width:0.7em; 
font - size:400%; 
font - family:algerian, courier; 
line— height:80%; 
float:left 
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} 
</style> 
</head> 


<body> 
<p><span>T</span> his is some text. 在 段落 中 ,文本 的 第 一 个 字母 包含 在 一 个 span 元 素 中 .这 个 


span 元 素 的 宽度 是 当前 字体 尺寸 的 0.7 倍 . span 元 素 的 字体 尺寸 是 400% , 行 高 是 80% .</p> 
</body> 
</html > 


网 页 设计 与 制作 | 


【本 章 导读 】 

在 互联 网 中 ,网 页 是 用 户 和 Web 进行 交互 的 主要 界面 ,用 户 通 过 网 页 来 进行 信息 浏览 
和 实现 与 Web 应 用 的 交互 。 网 页 是 存储 在 Web 服务 器 上 的 一 个 个 html、jsp、asp、php 等 各 
种 类 型 的 文档 在 浏览 器 中 的 显示 ,一 个 Web 应 用 或 者 一 个 网 站 是 由 大 量 的 网 页 构成 的 ,并 
通过 页 面 间 的 超 链接 表达 和 实现 业务 逻辑 。 网 页 作为 Web 应 用 的 用 户 界 面 , 不 仅 要 强调 它 
的 功能 性 ,还 必须 强调 它 的 艺术 性 效果 ,追求 用 户 体验 ,这 就 使 得 Web 应 用 的 设计 融入 了 更 
多 非 技术 的 要 素 ,网 页 设计 成 为 Web 开发 的 重要 内 容 。 

本 章 首先 介绍 页 面 设计 的 概念 ,将 页 面 设计 分 成 面向 业务 逻辑 的 功能 性 设计 (交互 设 
计 ) 和 面向 用 户 体验 的 视觉 设计 两 个 不 同 的 层面 。 然 后 重点 讨论 面向 用 户 体验 的 页 面 布 局 
设计 、 页 面 视觉 设计 和 页 面 效果 设计 的 有 关 问 题 。 接 下 来 ,对 常用 的 网 页 制作 工具 
FrontPage 进行 重点 讲解 ,按照 HTML 规范 的 框架 ,讲解 FrontPage 的 使 用 。 通 过 
FrontPage 的 讲解 ,可 以 使 读者 建立 软件 开发 中 开发 环境 和 工具 的 概念 ,同时 也 使 读者 对 
HTML 规范 有 一 个 更 加 全 面 的 认识 ,特别 是 标记 的 属性 ,通过 IntelliSense 技术 可 以 看 到 每 
一 个 标记 的 全 部 属性 。 

【知识 要 点 】 

4.1 节 : 网 页 设计 、 页 面 功能 与 内 容 设计 、 用 户 体验 、 页 面 布局 ,视觉 设 计 、 效 果 设 计 。 

4.2 节 : FrontPage 的 功能 、 网 站 。 

4.3 节 : 网 页 内 容 、 插 入 文本 、 插 入 图 片 、 建 立 超 链 接 、 插 入 表格 、 插 入 表单 。 

4.4 节 : 标记 属性 IntelliSense 技术 、 行 为 面板 。 

4.5 节 : 定义 标记 样式 、 用 户 自 定义 样式 类 、css 文件 。 

4.6 节 : 框架 、 浮 动 框架 。 


@.1 网 页 设计 基础 


和 传统 的 程序 界面 不 同 , 网 页 是 内 容 和 艺术 的 综合 体 。 网 页 在 实现 Web 应 用 系统 功能 
的 同时 ,表现 出 更 大 的 灵活 性 、 随 意 性 和 艺术 性 。Web 开发 团队 的 人 员 也 更 加 多 样 ,除了 
传统 的 系统 设计 人 员 、 代 码 开 发 人 员外 ,开始 出 现 了 美工 人 员 ,Web 设计 已 经 越 来 越 明显 
地 分 成 面向 业务 逻辑 的 功能 性 设计 (交互 设计 ) 和 面向 用 户 体验 的 视觉 设计 两 个 不 同 的 
层面 。 
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4.1.1 软件 系统 设计 与 MVC 设计 模式 


对 于 所 有 的 计算 机 软件 系统 ,不 论 其 规模 和 功能 大 小 ,站 在 概念 的 角度 ,一 个 计算 机 软 
件 系统 都 可 以 分 成 两 个 部 分 , 即 数据 和 程序 ,所 谓 数据 就 是 我 们 要 处 理 的 业务 数据 ,而 程序 
则 是 对 数据 的 处 理 , 它 表达 业务 逻辑 。 从 逮 辑 的 角度 讲 ,一 个 软件 系统 则 可 以 分 为 数据 、 业 
务 逻 辑 和 连接 逻辑 ,业务 逻辑 是 对 领域 业务 的 编程 (函数 ) ,连接 逻辑 是 指 这 些 业 务 逻 辑 之 间 
的 连接 和 调用 关系 (调用 机 制 , 如 函数 调用 、 消 息 机 制 等 )。 

在 软件 系统 的 开发 中 ,系统 设计 人 员 追 求 的 目标 就 是 要 保证 系统 的 可 维护 性 、 可 扩展 
性 ` 灵 活性 等 。 要 实现 这 样 的 目标 ,高 内 聚 、 低 耦合 是 一 种 重要 的 保证 。 围 绕 这 样 的 设计 目 
标 , 出 现 了 许多 设计 模式 。 在 Web 开发 中 ,模型 -视图 -控制 器 (Model-View-Controller， 
MVC) 设 计 模式 是 一 种 比较 流行 的 设计 模式 。MVC 设计 模式 并 不 是 一 种 新 的 模式 , 它 是 
Xerox PARC 在 20 世纪 80 年 代为 编程 语言 Smalltalk-802 发 明 的 一 种 软件 设计 模式 ,其 核 
心思 想 是 在 系统 开发 中 强制 性 地 使 应 用 程序 的 输入 ` 处 理 和 输出 分 开 , 把 数据 商业 迎 辑 和 
界面 显示 进行 分 离 ,分别 用 模型 .控制 器 和 视图 表示 ,它们 相对 独立 而 又 能 协同 工作 ,各 自 处 
理 自己 的 任务 ,多 辑 关 系 如 图 4-1 所 示 。 


[图 页 面 
视图 页 面 视图 (View) 
(Browsen 厂 一 | HTML 页 面 刻 3 
JSP 页 面 | 
1 
| 提交 表单 ! 
1 
控制 页 面 模型 文件 
(应 用 逻辑 ) (数据 操作 ) 
首页 | 一 | 
- 远 辑 导航 页 面 一- 一 -| JavaBean 
Servlet 程 序 服务 器 页 
控制 (Controller) 模型 (Model) 


图 4-1 Web 应 用 中 的 MVC 设计 模式 


模型 (Model) 表 示 企 业 数据 及 业务 规则 ,在 MVC 的 三 个 部 件 中 ,模型 拥有 最 多 的 处 理 
任务 ,实现 数据 操作 等 业务 逻辑 状态 管理 的 功能 。 被 模型 返回 的 数据 是 中 立 的 ,就 是 说 模 
型 与 数据 格式 无 关 , 这 样 一 个 模型 能 为 多 个 视图 提供 数据 。 由 于 应 用 于 模型 的 代码 只 需 写 
一 次 就 可 以 被 多 个 视图 重用 ,所 以 减少 了 代码 的 重复 性 。 

视图 (View) 是 用 户 看 到 并 与 之 交互 的 界面 ,通常 实现 数据 的 输入 (表单 页 面 ) 和 输出 
(控制 模块 返回 的 页 面 , 模 型 处 理 结 果 返 回 页 面 . 状 态 变化 等 ) 功 能 。 

控制 器 (Controller) 控 制 整个 业务 流程 ,实现 View 层 跟 Model 层 的 协同 工作 。 控 制 器 
接收 用 户 的 输入 并 调用 模型 和 视图 去 完成 用 户 的 需求 。 当 单 击 Web 页 面 中 的 超 链接 和 发 
送 HTML 表单 时 ,控制 器 本 身 不 输出 任何 东西 和 做 任何 处 理 , 它 只 是 接收 请 求 并 决定 调用 


@ Smalltalk 被 公认 为 历史 上 第 二 个 面向 对 象 的 程序 设计 语言 ,是 第 一 个 真正 的 集成 开发 环境 (IDE), 对 20 世纪 
90 年 代 的 许多 软件 开发 思想 有 重要 影响 。 
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哪个 模型 构件 去 处 理 请 求 , 然 后 确定 用 哪个 视图 来 显示 模型 处 理 返回 的 数据 。 
4.1.2 页 面 功能 与 内 容 设 计 


在 Web 应 用 或 Web 站 点 中 ,所 有 的 信息 和 业务 逻辑 都 通过 网 页 来 实现 。 页 面 作为 用 
户 和 Web 的 界面 ,其 功能 首先 是 交互 。 因 为 ,一 个 Web 站 点 通常 由 大 量 的 页 面 文件 构成 ， 
因此 对 页 面 的 功能 划分 、 存 储 和 组 织 应 按照 软件 系统 分 析 、 设 计 和 开发 相关 的 方法 和 模式 进 
行 ,包括 生命 周期 法 、 原 型 法 和 MVC 设计 模式 等 。 

综合 利用 生命 周期 法 、 原 型 法 和 MVC 设计 模式 ,对 整个 Web 站 点 进行 系统 分 析 和 功 
能 设计 ,然后 规划 文件 夹 结构 ,数据库 以 及 页 面 划 分 。 和 传统 的 软件 系统 开发 相 比 ,Web 站 
点 中 的 一 个 页 面 ,类 似 于 传统 软件 系统 中 的 一 个 源 文件 ,只 是 页 面 之 间 的 调用 是 通过 超 链 
接 , 或 者 页 面 中 包含 的 表单 的 action 属性 完成 的 ,而 不 是 传统 C 中 的 函数 调用 。 

根据 MVC 设计 模式 ,可 以 将 网 页 功能 进行 分 类 ,分 为 : 四 用 于 输入 输出 的 页 面 ( 视 
图 ); 加 服务 端 脚本 程序 页 面 (模型 ) ,这 类 页 面 不 在 浏览 器 中 显示 ,主要 是 负责 数据 的 查询 、 
存储 等 ; @ 导 航 页 面 ,类 似 MVC 中 的 控制 器 ,也 类 似 于 传统 程序 中 的 菜单 ,实现 页 面 之 间 
的 调用 和 导航 ,典型 的 导航 页 面 就 是 站 点 首页 。 将 网 页 按照 MVC 设计 模式 进行 分 类 可 以 
更 好 地 规划 一 个 Web 站 点 ,保证 站 点 的 可 扩展 性 、 灵 活性 和 可 维护 性 ,这 也 是 所 有 的 软件 设 
计 模 式 所 追求 的 目标 。 

页 面 的 功能 划分 主要 服务 于 Web 应 用 的 交互 ,提高 网 站 的 易 用 性 ,协助 用 户 顺利 地 完 
成 期 望 的 任务 流程 。 对 于 视图 类 和 导航 类 页 面 , 还 必须 考虑 其 用 户 体验 ,网 页 的 内 容 设计 也 
丰富 多 彩 ,包括 网 站 标志 、 导 航 、 菜 单 、 图 片 按钮 .表单 样式 、 表 格 数据 文字 表现 .新闻 、 公 告 、 
讨论 区 、Blogs、 友 情 链接 、 广 告 条 、 版 权 信 息 等 。 对 网 页 内 容 , 应 根据 内 容 和 用 户 特点 ,选用 
文本 ,图 片 .动画 等 不 同 的 媒体 形式 来 展示 ,以 产生 更 好 的 用 户 体验 。 


4.1.3 ”页面 布 局 设计 


在 Web 应 用 中 ,网 页 是 用 户 和 Web 的 人 机 界面 。 在 Web 设计 中 ,网 页 布局 越 来 越 重 
要 ,只 注重 内 容 , 而 忽视 页 面 布局 的 网 页 很 难产 生 较 好 的 用 户 体验 。 实 际 情况 是 ,用 户 对 页 
面 的 体验 第 一 印象 就 是 页 面 的 栏目 和 布局 ,然后 才 是 页 面 内 容 。 只 有 当 网 页 内 容 和 网 页 布 
局 完美 地 融合 时 ,才能 产生 最 好 的 用 户 体验 。 


1. 网 页 布局 设计 方法 


新 建 页 面 就 像 一 张 白 纸 , 没 有 任何 表格 ,框架 、 图 层 和 约定 俗 成 的 东西 。 接 下 来 ,设计 人 
员 根 据 页 面 内 容 、 浏 览 用 户 等 因素 对 页 面 布局 进行 设计 。 进 行 页 面 布局 ,通常 需要 先 在 纸 上 
或 者 利用 Photoshop 等 画图 程序 来 设计 草稿 , 画 出 页 面 布局 的 草图 ,然后 再 深入 加 工 , 最 后 
定稿 。 在 进行 页 面 布局 设计 时 ,需要 考虑 以 下 几 个 因素 。 

(1) 页 面 尺寸 。 页 面 尺 寸 和 显示 器 大 小 及 分 辩 率 有 关系 ,同时 浏览 器 本 身 ( 如 菜单 栏 、 
工具 栏 等 ) 也 将 占 去 一 定 的 屏幕 空间 ,这 在 页 面 布局 设计 时 必须 考虑 。 一 般 情况 下 ,以 1024X 
768 分 辩 率 为 标准 ,页 面 显示 尺寸 为 1007X 600。 此 外 ,如 果 页 面 尺 寸 采 用 像素 值 ,可 以 在 
一 body 二 二 /body 二 标记 对 内 ,增加 过 center 二 二 /center 二 标记 对 ,将 二 body 盖 一 /body 二 内 
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的 所 有 页 面 内 容 居中 ,以 应 对 不 同 的 屏幕 分 辩 率 。 

(2) 整体 造型 。 整 体 造 型 是 指 页 面 的 整体 形象 ,虽然 ,显示 器 和 浏览 器 都 是 矩形 ,但 对 
于 页 面 的 造型 ,可 以 充分 运用 自然 界 中 的 各 种 形状 以 及 它们 的 组 合 ,例如 和 矩形、 圆 形 、 三 角形 
以 及 不 规则 边界 的 图 形 等 。 

不 同 的 形状 所 代表 的 意义 是 不 同 的 。 例 如 : 矩形 代表 着 正式 ,规则 ,大 多 数 政府 网 页 都 
是 以 矩形 为 整体 造型 ; 圆 形 代表 着 柔和 、 团 结 、 温 暖 ,安全 等 ,许多 时 尚 站 点 喜欢 以 圆 形 为 页 
面 整体 造型 ; 三 角形 代表 着 力量 、 权 威 等 ,许多 大 型 的 商业 站 点 为 显示 其 权威 性 常 以 三 角形 
为 页 面 整体 造型 ; 大 部 分 的 游戏 场景 则 使 用 了 不 规则 的 图 形 。 

(3) 页 头 。 页 头 又 称 为 页 眉 ,页 头 常 放置 站 点 的 名 字 、 公 司 标志 或 旗帜 广告 。 页 头 的 内 
容 和 设计 风格 直接 影响 到 整个 页 面 的 协调 性 。 对 于 站 点 首页 ,为 了 有 效 利用 屏幕 空间 ,许多 
网 站 的 页 头 中 ,除了 放置 公司 标志 ,往往 在 页 头 右 侧 还 放置 了 一 组 超 链接 。 

在 页 头 下 方 , 往 往 是 一 个 Flash 动画 ,将 页 头 和 下 面 的 内 容 进 行 分 开 , 从 而 产生 较 好 的 
视觉 效果 。 大 多 数 的 门户 网 站 首页 都 采用 了 上 述 的 页 头 设计 ,例如 新 浪 、163 的 首页 页 头 。 

(4) 页 脚 。 页 脚 和 页 头 相 呼应 ,页 头 放置 站 点 主题 ,页 脚 则 放置 制作 者 、 公 司 信息 以 及 
版 权 信息 等 。 

(5) 菜单 。 和 传统 的 程序 类 似 , 在 网 页 上 也 通常 组 织 菜单 ,菜单 其 实 都 是 超 链接 ,将 这 
些 超 链接 组 织 成 树 状 目 录 结 构 或 弹出 式 菜单 形式 。 

(6) 超 链 接 。 在 具有 导航 功能 的 页 面 中 (相当 于 MVC 中 的 控制 器 ), 包 含 了 大 量 的 超 
链接 ,以 链接 到 其 他 页 面 。 可 以 按照 链接 的 内 容 , 将 超 链接 组 织 成 不 同 的 超 链接 区 。 例 如 ， 
许多 门户 网 站 的 各 种 版 块 栏目 ,就 是 一 个 个 的 超 链 接 区 。 超 链接 可 以 单独 出 现 ,也 可 以 组 织 
成 多 行 多 列 的 超 链 接 区 ,也 可 以 组 织 成 横向 菜单 条 ,或 者 纵向 的 超 链接 区 。 


2. 常见 的 网 页 布局 


在 数 以 亿 计 的 Web 页 面 中 ,网 页 的 布局 可 谓 千 差 万 别 。 由 于 网 页 的 功能 不 同 , 表 达 的 
内 容 不 同 , 人 们 的 审美 情趣 不 同 , 因 此 ,我们 不 可 能 要 求 设 计 人 员 设 计 统一 的 网 页 布局 。 虽 
然 如 此 ,有 许多 的 页 面 布局 是 很 多 设计 人 员 喜 欢 使 用 的 .如 下 。 

(1) 基于 栏目 的 页 面 布局 。 对 于 内 容 很 多 的 网 页 ,通常 将 页 面 按照 栏目 进行 组 织 ,组 织 
成 多 个 矩形 区 域 ( 内 容 板块 ) ,每 个 区 域 包含 一 组 超 链接 ,形成 一 个 超 链接 区 。 超 链接 区 通常 
包含 一 个 栏目 标题 ,栏目 之 间 通 过 色彩 块 来 区 分 。 为 了 增加 视觉 效果 ,在 栏目 之 间 ,或 矩形 
块 栏目 内 部 ,通常 插入 一 些 Flash 动画 广告 。 

基于 栏目 的 页 面 布局 主要 用 于 导航 页 面 设计 ,大 部 分 的 门户 网 站 首页 即 采用 基于 栏目 
的 页 面 布局 形式 ,例如 新 浪 、yahoo、163、265 上 网 导航 等 。 网 页 布局 示例 如 图 4-2 所 示 。 

基于 栏目 的 页 面 布局 主要 应 用 于 一 些 商 业 网 站 的 首页 。 为 吸引 用 户 , 增 加 用 户 访问 量 ， 
从 商业 运营 的 目的 出 发 ,网 站 的 内 容 很 多 ,分 成 了 不 同 的 超 链 接 区 域 ( 板 块 )。 为 节省 屏幕 空 
间 , 在 栏目 内 往往 还 使 用 标签 ,以 组 织 更 多 的 内 容 。 

(2) 整 幅 效果 型 布局 。 页 面 采 用 大 幅 图 片 或 Flash 动画 ,在 底部 加 一 “登录 ”按钮 ,通常 
用 于 站 点 首页 。 特 点 是 页 面 美观 ,可 以 较 好 地 展示 企业 形象 。 缺 点 是 登录 速度 较 慢 。 

(3)“ 口 ?型 页 面 布局 。 页 面 一 般 上 下 各 有 一 个 广告 条 ,左面 是 主 菜单 ,右面 放 友情 链接 
等 ,中 间 是 主要 内 容 , 这 种 页 面 布局 也 经 常用 于 一 些 站 点 的 首页 设计 。 
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图 4-2 基于 栏目 的 页 面 布 局 示例 


“ 口 "型 页 面 布 局 的 优点 是 充分 利用 版 面 ,信息 量 大 。 缺 点 是 页 面 拥挤 ,不 够 灵活 。 也 有 
将 四 边 空 出 ,只 用 中 间 的 窗口 型 设计 。 

(4)“ 工 ”型 结构 布局 。 所 谓 “ 工 ”型 结构 布局 ,是 指 将 页 面 分 成 上 、 中 、 下 三 个 部 分 ,页 面 
顶部 为 横 条 网 站 标志 十 广告 条 ; 下 面 是 版 权 等 信息 ; 中 间 为 主要 内 容 , 又 分 为 左右 两 个 部 
分 ,左面 为 主 菜单 ,右面 显示 内 容 的 页 面 布局 形式 。 示 例如 图 4-3 所 示 。 

“ 工 ? 型 页 面 布局 是 网 页 设计 中 用 得 最 广泛 的 一 种 布局 方式 ,这 种 布局 的 优点 是 页 面 结 
构 清 晰 , 主 次 分 明 。 缺 点 是 规矩 呆板 ,如 果 细 节 和 色彩 搭配 不 好 ,很 难 让 人 留 下 印象 ,不 适宜 
做 前 卫 的 和 个 性 化 强 的 站 点 。 

(5) 自 顶 向 下 层次 结构 布局 。 该 种 布局 形式 是 指 将 页 面 自 顶 向 下 分 成 几 个 平行 的 区 
域 , 顶 部 是 页 头 , 接 下 来 的 区 域 分 别 放置 超 链接 块 , 最 下 面 的 区 域 显 示 具 体 的 文章 正文 内 容 。 
一 些 文章 页 面 或 注册 页 面 等 经 常 采用 这 种 类 型 的 页 面 布局 。 

(6) 自由 式 结构 布局 。 上 述 的 结构 布局 可 称 做 “传统 型 ?页 面 布局 ,还 有 一 些 页 面 结构 
布局 打破 了 传统 的 页 头 、 页 尾 、 菜 单 . 栏 目 , 超 链接 区 域 等 布局 模式 ,把 页 面 设计 成 一 幅 极 具 
创意 的 广告 作品 。 这 种 页 面 的 结构 布局 通常 用 精美 的 图 片 、 网 站 标识 性 图 案 (Logo) 或 变形 
的 艺术 化 文字 作为 设计 中 心 进行 主体 构图 。 菜 单 . 栏 目 条 等 则 按 次 要 元 素 处 理 , 自 由 地 安排 
在 页 面 上 ,起 到 点 级、 修饰 ,均衡 页 面 的 效果 。 

自由 式 结构 布局 的 优点 是 页 面 靓 丽 、 现 代 、 轻 松 ` 节 奏 明快 ,很 容易 让 访问 者 驻足 欣赏 。 
缺点 是 下 载 速 度 缓慢 ,文字 信息 量 少 , 信 息 的 逻辑 表达 能 力 弱 ,浏览 者 不 易 直 奔 主题 ,信息 查 
找 麻烦 。 自 由 式 结构 布局 一 般 用 在 时 尚 类 站 点 上 ,如 时 装 、 化 妆 品 等 以 崇尚 现代 、 美 感 为 主 


197 


Ne 


198 


Ae 


Web 技 术 导 论 (第 3 版 ) 


题 的 站 点 ,专业 性 的 商务 站 点 不 宜 采用 。 

页 面 布局 设计 是 一 项 复杂 的 创意 工作 ,在 进行 页 面 布局 设计 时 ,需要 根据 站 点 的 性 质 
(例如 专业 性 商务 站 点 .前 卫 现代 时 尚 类 站 点 等 )、 页 面 的 功能 ,是否 首 页 、 页 面 内 容 的 多 少 ， 
进行 精心 策划 ,才能 设计 出 功能 性 和 视觉 效果 好 的 页 面 。 


了 
自生 mgt 旭 


(es 
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i 
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图 4-3 “ 工 ” 型 页 面 布局 示例 


4.1.4 ”页面 视觉 设计 


视觉 设计 是 指 利用 视觉 符号 来 传递 各 种 信息 的 设计 ,其 应 用 的 范畴 很 广 ,可 以 包括 工业 
产品 设计 、 广 告 设计 、 新 媒体 设计 、 服 饰 设计 等 。 在 Web 中 , 则 有 网 页 的 视觉 设计 。 在 网 页 
中 ,视觉 设计 和 功能 性 设计 不 同 , 它 没有 功能 性 要 求 , 没 有 太 多 的 理论 约束 ,更 多 的 是 体现 出 
感性 和 个 性 元 素 ,服务 于 人 的 审美 情趣 。 可 以 把 页 面 视觉 设计 分 成 色彩 、 图 形 和 字体 几 个 
方面 。 

在 页 面 的 视觉 效果 的 诸多 影响 因素 中 ,色彩 设计 产生 的 视觉 效果 最 直接 和 明显 ,不 同 功 
能 的 网 站 ,其 颜色 的 主 色调 设计 也 不 相同 。 大 部 分 网 站 都 追求 一 种 明快 的 颜色 设计 ,例如 绿 
色 深蓝、 橙色 和 粉红 色 ,这 些 颜 色 都 十 分 人 气 。 其 次 是 颜色 的 搭配 ,浓重 的 主 色 调 表明 了 幽 
默 的 态度 ,也 有 助 于 人 们 迅速 注意 到 页 面 上 的 重要 元 素 。 

关于 图 形 的 应 用 ,现在 许多 Web 2. 0 站 点 的 页 面 都 避免 使 用 照片 ,大 都 选择 简洁 的 图 
标 和 截图 。 可 以 将 图 形 的 应 用 分 为 两 个 方面 。@ 用 于 信息 反馈 。 信 息 反馈 一 般 有 以 下 五 种 
情况 : 成 功 ` 失 败 、 询 问 、 警 告 、 错 误 /异常 ,视觉 辅助 图 必须 表达 每 种 情况 的 准确 含义 。 四 增 
加 趣味 性 。 为 了 增加 趣味 性 ,通常 用 图 形 来 表现 一 种 状态 ,例如 ,表现 喜 怒 哀乐 的 简单 图 形 。 
当 使 用 图 形 时 ,图 形 的 设计 一 定 要 注意 它 的 准确 性 ,否则 会 起 到 相反 的 效果 。 例 如 ,用 一 个 
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惊讶 的 表情 来 表示 警告 ,但 往往 被 误 以 为 是 询问 或 者 出 现 了 异常 。 

对 于 文字 的 字体 ,更 多 的 应 选择 大 号 字 。 另 外 ,要 注意 发 挥 空白 的 作用 ,巧妙 利用 空白 
可 以 提高 页 面 的 易 读 性 和 易 用 性 。 空 白 可 以 分 离 出 重要 信息 ,使 眼睛 得 到 休息 ,并 给 人 以 冷 
静 和 有 秩序 的 感觉 。 

此 外 ,从 总 体 上 来 讲 , 页 面 设计 还 需要 遵循 几 点 一 般 性 的 原则 ,包括 : 平衡 ,避免 一 边 
倒 \ 头 重 脚 轻 ,可 以 是 均衡 对 称 ,也 可 以 是 不 均衡 对 称 ; @ 重 点 突出 ,有 且 只 有 一 个 视觉 趣味 
中 心 (Center of Visual Interest,CVD) ,可 以 通过 对 位 置 、 对 比 和 比例 的 处 理 来 实现 ; @ 简 化 
原则 ,去 除 或 尽量 弱化 干扰 ,突出 一 点 ; @ 重 复原 则 ,通过 合理 重复 ,形成 一 个 视觉 模式 ; 
回 统 一 一 致 ,保持 风格 的 一 致 性 ; @ 便 利 性 、 可 读 性 与 易 辨认 ,便于 浏览 者 阅读 。 

最 后 简单 地 总 结 一 下 ,功能 性 设计 通常 是 一 种 交互 设计 ,其 主要 目标 是 提高 系统 的 易 用 
性 ; 视觉 设计 的 主要 目标 不 是 功能 性 的 , 它 的 目标 是 提高 人 们 的 视觉 感受 。 视 觉 设计 是 一 
项 复杂 的 艺术 创造 ,需要 很 深厚 的 艺术 文化 积淀 。 虽然 人 们 不 断 推崇 务实 的 简约 设计 概念 ， 
但 是 另类 的 创新 艺术 表现 也 不 时 地 出 现在 各 种 时 尚 和 前 卫 的 网 站 中 。 


4.1.5 页 面 效 果 设 计 


当 网 页 的 整体 布局 确定 后 , 接 下 来 就 是 效果 设计 了 。 效 果 设 计 就 是 利用 Photoshop 等 
图 形 图 像 处 理工 具 ,按照 页 面 的 布局 设计 ,来 设计 页 面 的 完整 图 片 。 然 后 对 图 片 进 行 切 图 ， 
为 下 面 的 页 面 html 代码 编写 准备 images。 图 4-4 是 使 用 Photoshop 设计 完成 的 一 个 Blog 
页 面 的 设计 效果 图 示例 。 
教师 博客 MyBlog 系统 首页 | 学 习 论坛 | 学 生 作品 | 在 本 交流 
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图 4-4 页 面 设计 效果 图 示例 
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当 页 面 设计 效果 图 完成 后 , 接 下 来 就 是 进行 切 图 。 将 效果 图 中 的 元 素 剪 切 为 一 个 个 小 
的 图 片 ,以 保证 网 页 的 浏览 速度 。 首 先 要 分 析 页 面 效 果 图 , 它 是 未 来 网 页 的 显示 效果 。 对 于 
上 述 的 页 面 效 果 图 , 切 图 时 应 从 以 下 两 个 方面 考虑 。 

(1) 在 页 面 上 部 是 一 行 带 有 背景 的 菜单 ,因此 ,可 以 从 中 切 一 个 像素 宽度 为 1 的 小 图 
片 , 在 页 面 html 代码 中 ,利用 该 图 片 实现 table 单元 格 中 的 背景 横向 填充 ,以 达到 效果 图 的 
显示 效果 。 如 果 需 要 纵向 填充 ,可 以 取 高 度 为 1 的 小 图 片 ,进行 纵向 填充 。 

(2) 对 于 页 面 主体 中 的 一 些 栏目 标题 ,可 以 直接 切 为 小 图 片 , 这 些 图 片 的 文件 很 小 。 

其 他 的 页 面 元 素 , 操 作 类 似 。 最 后 将 这 些 切 图 图 片 存储 到 一 个 特定 的 images 文件 夹 
中 , 它 是 下 一 步 进行 html 页 面 设计 的 素材 。 

在 页 面 效 果 设计 中 ,还 涉及 了 其 中 的 文字 ,对 于 文字 内 容 ,可 以 通过 CSS 技术 ,来 定义 
文字 的 样式 。 如 果 布 局 采用 Table, 表 格 属性 要 定义 CSS, 从 而 实现 页 面 布局 和 显示 样式 的 
分 离 ,增加 页 面 维护 的 灵活 性 。 关 于 CSS 的 使 用 ,参考 第 3 童 。 


6.2 使 用 FrontPage 


FrontPage 是 微软 开发 的 一 种 可 视 化 的 网 页 制作 和 站 点 管理 工具 。FrontPage 的 功能 
可 以 分 为 站 点 管理 和 网 页 制作 两 个 大 的 方面 。FrontPage 有 FrontPage 2000 和 FrontPage 
2003 两 个 常用 版 本 ,两 者 没有 本 质 的 区 别 。 下 面 以 FrontPage 2003 为 例 ,重点 介绍 网 页 制 
作 工 具 的 网 页 制作 方法 。 


4.2.1 FrontPage 主 窗口 


运行 FrontPage 2003,FrontPage 打开 后 ,首先 需要 打开 一 个 网 站 ( 即 打开 站 点 对 应 的 
主 目录 文件 夹 ) ,一 个 站 点 不 一 定 是 一 个 Web 服务 器 上 真正 运行 的 网 站 ,可 以 是 本 地 机 上 的 
一 个 文件 夹 。 接 下 来 可 以 在 该 文件 夹 下 新 建 网 页 ,或 对 网 页 进行 维护 。 主 界面 如 图 4-5 
所 示 。 

在 FrontPage 2003 主 窗口 中 ,可 以 显示 网 站 文件 夹 列表 ,双击 某 个 网 页 文件 ,在 右边 则 
打开 该 文件 。 在 窗口 的 右 侧 是 任务 窗 格 , 列 出 了 我 们 最 经 常 要 做 的 事 , 比 如 打开 网 站 、 打 开 
网 页 .新 建 网 站 网 页 等 。 这 是 一 项 非常 良好 的 设计 , 它 比 传统 的 利用 “文件 "菜单 或 工具 栏 按 
钮 更 方便 ,有 些 软 件 在 工具 栏 的 最 右 侧 会 安排 类 似 的 功能 。 对 任务 窗 格 , 可 以 通过 “视图 ”一 
“任务 窗 格 ” 命 令 打 开 或 关闭 。 

在 网 页 文件 设计 窗口 的 左下 角 , 有 一 组 网 页 视图 模式 的 选项 标签 ,分 别 是 “设计 ”、“ 拆 
分 ”“ 代 码 ” 和 “预览 ”四 种 显示 模式 。 如 果 是 框架 网 页 ,还 含有 其 他 的 几 个 标签 。 单 击 标签 ， 
可 以 选择 不 同 的 工作 模式 。 


1. 设计 模式 


设计 模式 是 一 种 可 视 化 的 网 页 设计 模式 。 在 设计 模式 下 .用 户 可 以 采用 “所 见 即 所 得 ” 
的 方式 设计 ,编辑 和 修改 网 页 ,系统 将 自动 生成 对 应 的 HTML 代码 。 代 码 可 在 代码 模式 或 
拆 分 模式 下 显示 。 这 是 FrontPage 工具 的 核心 功能 , 即 从 设计 到 代码 生成 。 
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图 4-5 FrontPage 2003 主 窗口 


2. 拆 分 模式 


选择 拆 分 模式 , 则 客户 工作 区 分 为 上 下 两 个 区 域 ,下 面 的 区 域 显示 设计 的 网 页 ,上 面部 
分 显示 对 应 的 HTML 代码 。 该 模式 的 目的 是 将 设计 中 的 网 页 元 素 和 对 应 代码 准确 定位 ， 
当 单 击 设计 视图 的 某 个 网 页 元 素 时 ,在 上 面 的 代码 视图 将 自动 定位 到 该 元 素 对 应 的 HTML 
代码 ,这 对 于 一 个 较 大 的 网 页 修改 是 非常 方便 的 ,便于 手工 调整 。 


3. 代码 模式 


在 代码 模式 下 ,将 显示 设计 中 的 网 页 对 应 的 HTML 代码 。 一 般 情况 下 ,用 户 在 设计 模 
式 下 设计 网 页 ,然后 在 代码 模式 下 查看 网 页 对 应 的 HTML 代码 。 另 外 ,用 户 也 可 以 直接 在 
该 模式 下 编辑 修改 其 中 的 HTML 代码 ,适用 于 那些 对 HTML 比较 熟悉 的 用 户 。 如 果 网 
页 中 包含 一 些 脚 本 程序 , 则 这 些 脚 本 程序 也 需要 通过 代码 模式 进行 编辑 。 

如 果 用 户 需要 复制 其 他 网 页 的 HTML 代码 ,应 选择 代码 模式 ,将 被 复制 的 内 容 复 制 到 
当前 网 页 的 适当 位 置 , 而 不 应 该 在 设计 模式 下 进行 复制 。 


4. 预览 模式 


选择 预览 模式 ,将 对 设计 的 网 页 进行 预览 ,与 通过 浏览 器 所 看 到 的 网 页 一 致 。 另 外 ,如 
果 网 页 中 包含 脚本 程序 ,在 程序 的 调试 阶段 通过 FrontPage 的 预览 模式 可 以 很 容易 查 出 程 
序 出 错 的 位 置 和 错误 性 质 。 
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4.2.2 网 站 的 新 建 与 维护 


FrontPage 不 仅 是 一 个 页 面 制作 工具 ,同时 , 它 还 可 以 进行 站 点 管理 操作 ,包括 创建 、 删 
除 ,打开 发 布 站 点 ,以 及 进行 站 点 的 维护 等 工作 。 也 可 以 对 站 点 的 文件 和 文件 夹 进行 操作 
以 及 对 站 点 进行 安全 性 管理 。 


1. 新 建 网 站 


创建 一 个 Web 站 点 ,本 质 上 就 是 建立 一 个 主 目录 ,然后 在 主 目录 下 创建 子 目录 和 网 页 
文件 。 用 户 可 以 手工 建立 站 点 目录 结构 ,通过 资源 管理 器 可 以 定位 具体 的 文件 夹 和 文件 。 
为 了 管理 方便 ,现在 的 网 页 制作 工具 都 提供 了 新 建站 点 和 站 点 管理 ,以 方便 对 站 点 的 维护 。 

在 FrontPage 中 ,提供 了 创建 站 点 的 模板 和 向 导 ,通过 它们 可 以 很 容易 地 建立 起 一 个 新 站 
点 , 即 创建 站 点 目录 结构 。 操 作 方法 是 : 选择 “文件 一“ 新建" 命令, 显示“ 新建" 任务 窗 格 ; 在 
“新 建 网 站 ”选项 组 中 , 单 击 其 中 的 任何 一 个 超 链接 ,都 打开 “网 站 模板 "对话 框 ,如 图 4-6 所 示 。 


常规 。 [小 据 包 ] Sharepoint Services| 

国画- 画面 5 
a ” rp 选项 
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国 立 | 55 
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2 外 es 口 添加 当前 网 站 四 ) 
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图 4-6 “网 站 模板 ”对 话 框 


单 击 “ 个 人 网 站 ”, 在 “指定 新 网 站 的 位 置 ”文本 框 中 ,输入 一 个 文件 夹 名 ,该 文件 夹 即 为 
站 点 主 目录 , 单 击 “ 确 定 ” 按 钮 。 向 导 则 自动 创建 一 个 站 点 主 目录 ,并 根据 模板 ,创建 相应 的 
子 文件 夹 和 网 页 文件 ,如 图 4-7 所 示 。 

在 屏幕 的 左边 ,显示 网 站 的 目录 结构 ,这 便于 站 点 的 管理 和 维护 。 如 果 不 显示 文件 夹 列 
表 , 选 择 “ 视 图 ”一 “文件 夹 列表 ”命令 , 即 可 打开 站 点 文件 夹 列表 ,以 便于 对 站 点 的 操作 。 在 
网 站 窗口 的 下 部 ,显示 “文件 夹 "“ 远 程 网 站 ”“ 报 表 ”、“ 导 航 ”“ 超 链接 ”和 “任务 ”多 个 选项 
卡 , 选 择 “ 导 航 ” 选 项 卡 ,显示 网 站 中 各 个 网 页 之 间 的 超 链接 。 


2. 本 地 网 站 维护 
一 个 站 点 ,本 质 上 是 由 一 个 文件 夹 ,以 及 其 中 包含 的 所 有 网 页 文件 构成 的 。 如 果 在 
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图 4-7 新 建 个 人 站 点 
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回 sharePoint 工作 组 网 站 . 
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Web 服务 器 上 ,一 个 站 点 是 真实 运行 的 网 站 。 如 果 是 在 一 台 桌 面 机 上 ,例如 Windows XP 
上 ,同样 可 以 创建 一 个 站 点 ,如 果 仅 仅 是 纯 HTML 文件 ,不 包含 服务 器 脚本 , 它 同样 可 以 运 
行 。 此 外 ,对 于 任意 一 个 文件 夹 , 用 户 也 可 以 作为 一 个 站 点 来 打开 ,在 其 中 新 建 网 页 。 
因此 ,无 论 是 在 Web 服务 器 上 ,还 是 在 桌面 机 上 ,都 可 以 使 用 FrontPage 对 一 个 本 地 的 
文件 夹 (看 做 网 站 主 目录 ) 进 行 维护 ,具体 步骤 如 下 。 
(1) 在 FrontPage 中 ,选择 “文件 ”>“ 打 开 网 站 ”命令 ,打开 “打开 网 站 ”对 话 框 ,如 图 4-8 


所 示 。 


打开 网 站 


Xx 


查找 范围 ;总 我 的 电脑 | @- 久 QQ Xx 六 司 - WOW- 


图 4-8 “打开 网 站 ”对 话 框 
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在 “查找 范围 "下 拉 列 表 框 中 ,选择 网 站 对 应 的 主 文件 夹 ,“ 网 站 名 称 ” 下 拉 列 表 框 中 不 需要 
输入 内 容 , 单 击 “ 打 开 ” 按 钮 , 则 文件 夹 名 即 为 网 站 名 ,然后 显示 网 站 视图 ,显示 网 站 目录 结构 。 

如 果 打 开 的 文件 夹 是 一 个 普通 的 文件 夹 ,FrontPage 将 在 该 文件 夹 下 添加 两 个 子 文件 
夹 _private 和 images。 

(2) 选择 “视图 ”一 “文件 夹 列表 ”命令 ,显示 网 站 文件 夹 结构 。 接 下 来 就 可 以 对 站 点 进 
行 各 种 各 样 的 维护 和 管理 操作 了 。 

站 点 的 维护 主要 是 指 : 在 站 点 主 目录 下 新 建 、 删 除 、 修 改 文件 夹 ; 在 某 个 文件 夹 中 ,新 
建 网 页 ,修改 网 页 或 删除 网 页 文件 等 。 在 网 站 “文件 夹 列表 ”中 ,在 某 个 文件 夹 上 右 击 ,打开 
快捷 菜单 ,可 以 选择 “删除 ”“ 重 命名 ”“ 新 建 (文件 夹 、 空 白 网 页 )" 等 命令 。 

如 果 在 某 个 网 页 文件 上 双击 , 则 打开 该 网 页 文件 ,显示 网 页 设计 视图 ,可 以 进行 网 页 的 
制作 (编辑 ) 和 内 容 修 改 等 操作 , 即 网 页 制作 。 


4.2.3 新 建 网 页 


一 个 网 站 对 应 一 个 主 目录 ,里 面包 含 大 量 的 网 页 文件 ,这 些 网 页 通常 按照 网 页 功能 组 织 
在 不 同 的 文件 夹 中 。 因 此 ,一 个 网 站 和 传统 的 软件 开发 中 的 一 个 项 目 (Project) 类 似 , 每 一 
个 网 页 文件 都 是 网 站 的 一 部 分 。 一 种 良好 的 网 页 制作 思想 是 ,在 新 建 或 编辑 网 页 以 前 ,应 该 
先 打 开 一 个 站 点 ,因为 ,任何 网 页 都 是 一 个 站 点 的 一 部 分 ,而 不 是 孤立 存在 的 。 

在 FrontPage 2003 中 ,要 新 建 一 个 网 页 ,可 以 使 用 “文件 ”菜单 命令 或 主 窗口 右 侧 的 任 
务 窗 格 导 航 完成 (如 果 没 有 开启 任务 窗 格 ,选择 “视图 ”一 “任务 窗 格 ” 命 令 ) ,通常 经 过 以 下 几 
个 步骤 。 

(1) 选择 “打开 网 站 ”命令 ,选择 要 打开 的 网 站 主 目录 。 因 为 每 一 个 网 页 都 是 网 站 的 一 
部 分 ,因此 ,新建 网 页 前 ,首先 应 打开 网 页 隶属 的 网 站 。 

(2) 选择 “文件 ”一 “新 建 " 命 令 , 在 客户 区 右 侧 显示 “新 建 "任务 窗 格 。 

(3) 在 网 站 文件 夹 列表 中 , 单 击 要 新 建 网 页 的 文件 夹 。 

(4) 在 “新 建 " 任 务 窗 格 中 , 单 击 “ 空 白 网 页 ” 超 链 接 ,将 新 建 一 个 空白 网 页 。 单 击 “ 其 他 
网 页 模板 ”, 则 打开 “网 页 模板 ”对 话 框 ,显示 FrontPage 提供 的 默认 模板 ,如 图 4-9 所 示 。 


4-9 “网 页 模板 ”对 话 框 (1) 
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用 户 可 以 用 这 些 模 板 来 建立 相应 的 网 页 ,在 右 下 角 的 预览 区 域 可 以 看 到 选中 模板 的 
外 观 。 

新 建 网 页 后 ,系统 将 生成 一 个 html 文档 内 容 的 基本 框架 ,在 “代码 ”模式 或 “ 拆 分 "模式 
下 ,可 以 看 到 相应 的 html 代码 内 容 , 如 图 4-10 所 示 。 
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图 4-10 ”新建 网 页 系统 自动 生成 的 html 代码 


可 以 看 到 ,在 文档 的 二 body 二 … 三 /body 二 标记 之 间 , 还 没有 内 容 , 具 体内 容 根据 用 户 
的 需要 来 设计 。 

使 用 FrontPage 编辑 网 页 ,实际 上 就 是 利用 FrontPage 的 菜单 命令 ,在 网 页 中 输入 文 
本 ,插入 图 片 ,建立 超 链接 ,插入 表格 、 表 单 等 操作 ,FrontPage 将 自动 生成 对 应 的 html 代 
码 , 从 而 简化 html 文档 的 手工 编写 任务 。 

为 了 扩大 网 页 编辑 窗口 的 空间 ,可 以 将 网 站 的 “文件 夹 列表 ”视图 关闭 ,如 果 需 要 打开 ， 
选择 “视图 ”>“ 文 件 夹 列表 ”命令 (Alt 十 F1) 即 可 。 

(5) 网 页 编辑 完成 后 ,选择 "文件 ”保存 文件 命令 ,或 者 直接 单 击 “ 常 用 ”工具 栏 中 的 
“保存 文件 ”按钮 ,保存 当前 网 页 。 

如 果 网 页 文件 是 第 一 次 存盘 , 则 打开 “另存 为 对话 框 ,从 中 选择 网 页 的 存储 位 置 、 文 件 


人 3 网 页 编辑 


当 网 页 文件 创建 后 , 接 下 来 就 是 网 页 内 容 的 编辑 了 。 网 页 文件 是 一 种 符合 html 规范 的 
纯 文本 文件 ,可 以 使 用 任意 的 文本 编辑 器 进行 编辑 ,但 是 这 样 的 编辑 需要 非常 熟悉 html 规 
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范 , 并 且 效 率 很 低 , 容 易 出 错 。 因 此 .对 网 页 的 编辑 通常 使 用 FrontPage、Dreamweaver 等 可 
视 化 的 网 页 制作 工具 来 完成 。 

使 用 FrontPage 进行 网 页 编辑 ,实际 上 就 是 利用 FrontPage 的 菜单 命令 ,在 网 页 中 输入 
文本 ,插入 图 片 ,建立 超 链 接 , 插 入 表格 、 表 单 等 内 容 ,FrontPage 将 自动 生成 对 应 的 html 代 
码 , 从 而 简化 html 文档 的 手工 编写 工作 。 


4.3.1 输入 文本 内 容 


文字 是 Web 页 的 主要 内 容 , 在 html 规范 中 ,有 很 多 标记 用 于 对 文本 进行 标记 ,如 二 p 二 、 
去 font 过 等 ,使 用 这 些 标记 可 以 实现 文本 显示 的 格式 化 , 即 设 定 文本 在 浏览 器 中 的 显示 
效果 。 

在 FrontPage 中 ,文本 的 输入 和 格式 化 非常 简单 。 在 设计 模式 下 ,在 编辑 区 域 进行 输 
入 ,再 通过 “格式 ”工具 栏 对 文本 进行 格式 化 ,或 者 通过 * 超 链接 ”工具 按钮 瑚 将 文本 设置 为 
超 链接 (一 a 之 … 一 /a> 标 记 ) 。 

例如 ,在 设计 模式 下 输入 一 行文 本 “泰山 ”, 并 进行 简单 的 格式 化 (居中 ,加 粗 , 字 号 , 颜 
色 ) ,如 图 4-11 所 示 。 


同 回 因 


=rzh-en"》 
x /html; charset=gb2312"> 


”color=" 孝 P0000" 于 山 册 /font>Jb>Yp> 
Ybody> 


泰 山 | 


口 设计 加 和 拆 到 | 口 代码 己 预 览 | 3 


图 4-11 文本 内 容 的 输入 与 格式 化 
在 拆 分 模式 下 ,或 代码 模式 下 ,可 以 看 到 在 王 body 之 … 志 /body 过 标记 内 增加 了 如 下 
代码 : 
<p align = "center"><b>< font size= "6" color =" 井 FF0000"> 泰 山 </font ></b></p> 


这 段 代 码 是 FrontPage 根据 我 们 的 输入 和 格式 化 自动 生成 的 ,可 见 通过 FrontPage 进 
行 网 页 设计 要 比 用 “记事 本 ”等 程序 手工 书写 html 代码 方便 和 快捷 得 多 ,并 且 也 不 容易 出 
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错 ,不 需要 记忆 各 种 标记 属性 ,这 正 是 FrontPage、Dreamweaver 等 工具 的 优势 所 在 。 
使 用 FrontPage、Dreamweaver 等 工具 ,用 户 也 可 以 从 记忆 大 量 的 html 标记 的 任务 中 
解脱 出 来 ,从 而 把 重点 放 在 网 页 布局 的 设计 和 业务 逻辑 的 设计 上 。 


4.3.2 插入 图 片 


在 网 页 制作 中 经 常 需要 插入 一 些 图 片 ,以 达到 丰富 信息 内 容 和 美化 页 面 的 双重 功能 。 
在 网 页 中 插入 图 片 , 即 通过 二 img 二 标记 来 指向 一 个 图 片 文件 ,为 了 页 面 布局 的 需要 ,通常 
还 需要 设置 一 img 二 标记 的 属性 。 

使 用 FrontPage 在 网 页 中 插入 一 幅 图 片 ,具体 操作 步骤 如 下 。 

(1) 将 插入 点 定位 到 要 插入 图 片 的 地 方 (本 例 定位 到 文字 的 开始 )。 

(2) 选择 “插入 ”一 图片” 一 “来 自 文件 ”命令 ,打开 “图 片 ”对 话 框 ; 选择 要 插入 的 图 片 
文件 , 单 击 “ 插 入 ”按钮 , 则 图 片 自动 以 无 环绕 样式 的 方式 插入 到 网 页 中 。 

(3) 设置 图 片 属 性 。 由 于 图 片 的 高 度 和 文字 不 一 致 , 接 下 来 应 该 设置 图 片 的 环绕 方式 。 
在 FrontPage 2003 中 , 右 击 图 片 ,在 快捷 菜单 中 选择 “图 片 属性 ”命令 ,打开 图 片 属性 对 话 
框 ,从 中 可 设置 图 片 环绕 样式 。 

设置 完成 后 的 页 面 如 图 4-12 所 示 。 


泰山 
泰山 是 中 国 五 岳之 首 ， 古 名 岱山 ， 又 名 岱 宗 。 泰 山 位 于 山东 省 中 
部 ， 秦 安 市 境内 ， 剖 立 在 鲁 中 群 山 间 ， 主 峰 玉 皇 顶 ， 海 拔 1545 米 。 泰 


山 山体 雄伟 壮观 ， 景 色 秀 丽 。 古 以 东方 为 万 物 交 普 、 初 罕 发 生 之 地 ， B、 
故 泰山 有 “五 岳之 长 ”、“ 五 岳 独 苯 ” 之 准 。 


早 在 夏 、 商 时 代 ， 就 有 72 个 君王 来 泰山 会 诸 候 、 定 大 位 ， 刻 石 记 
号 。 秦 始 皇 统一 中 国 封 禅 素 山 后 ， 汉 代 武 帝 、 光 武帝 ， 唐 代 高 宗 、 玄 
宗 ， 朱 代 真 宗 ， 清 代 康 熙 、 乾 隆 等 也 都 相继 效仿 来 泰山 举行 封 禅 大 
和 典 ， 所 到 之 处 ， 建 庙 塑 像 ， 刻 石 题字 ， 为 秦山 留 下 了 大 量 的 文物 古迹 。 历 代 著 名 的 文人 学 士 ， 也 都 幕 名 相 
继 来 此 ， 赞 颂 泰 山 的 诗词 、 歌 赋 多 达 一 千 余 首 。 杜 甫 的 《望月 } 诗 : “会 当 凌 绝 项， 一 览 众 山 小 。” 已 成 
为 流传 千古 的 名 诗 。 


秦山 同时 又 是 佛 、 道 两 教之 地 ， 因 而 庙宇 、 名 胜 饥 布 全 山 。 因 此 ， 秦 山 不 仅 有 雄 奇 壮丽 的 山 势 ， 而 且 
有 众多 的 文物 古迹 ， 也 是 一 座 道教 和 名山。 山顶 更 有 四 大 奇观 : 旭日 东升 、 晚 起 夕照 、 黄 河 金 代 、 云 海 玉 


国 


Meshps 055 x 424 默 人 自 定 X 


图 4-12 在 网 页 中 插入 图 片 


选择 “ 拆 分 ?或 “代码 ”显示 模式 ,可 以 看 到 在 二 body 二 … 二 /body 二 标记 内 增加 了 一 行 
类 似 下 面 的 代码 : 


< img src = "file:///c:/xxx/tai. jpg" width = "281" height = "175" align = "right"> 
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这 是 图 片 的 绝对 路 径 ,在 Web 应 用 开发 中 ,要 避免 使 用 绝对 路 径 。 因 为 , 当 网 页 文件 或 
者 存储 图 片 的 目录 发 生 改变 ,在 打开 网 页 时 就 会 出 现 找 不 到 图 片 文件 的 错误 ,图 片 在 浏览 器 
中 不 能 被 显示 。 

为 什么 会 产生 上 述 问题 呢 ? 这 是 因为 : 如 果 是 在 一 个 新 建 的 网 页 中 插入 图 片 ,因为 当 
前 网 页 尚未 保存 ,因此 无 法 判断 网 页 文件 和 图 片 文件 之 间 的 相对 路 径 , 只 能 采用 绝对 路 径 的 
方式 插入 。 此 时 ,如 果 将 新 建 的 网 页 先 保存 一 次 ,再 插入 图 片 时 ,在 html 代码 中 就 会 使 用 相 
对 路 径 。 或 者 ,即使 不 是 先 插入 了 图 片 , 只 要 保存 一 次 html 文件 ,原先 的 绝对 路 径 也 会 变 成 
相对 路 径 。 但 是 ,如 果 html 文件 和 图 片 不 在 一 个 驱动 器 上 ,将 不 能 转换 成 相对 路 径 。 

最 后 要 记 住 ,既然 是 一 个 Web 应 用 ,所 有 的 网 页 和 用 到 的 图 片 以 及 其 他 各 种 文件 都 应 
该 保存 在 Web 站 点 的 主 目录 下 ,或 者 主 目录 下 面 的 子 目录 下 。 所 有 这 些 文件 共同 构成 了 一 
个 Web 应 用 ,所 有 的 引用 都 应 该 是 相对 路 径 ,这 样 当 Web 应 用 , 即 该 站 点 被 复制 到 其 他 的 
目标 位 置 时 , 才 不 会 出 现 找 不 到 网 页 或 图 片 的 错误 。 因 此 ,如 果 页 面 编辑 前 执行 了 打开 网 
站 ”命令 , 当 插入 的 图 片 不 在 主 目录 下 ,保存 网 页 时 会 出 现 * 保 存 蔡 入 式 文 件 提 示 对 话 框 。 

图 片 插入 以 后 它 在 页 面 上 的 大 小 、 位 置 等 可 能 并 不 理想 。 要 使 得 图 片 符合 用 户 的 要 求 ， 
需 通 过 设置 图 片 属性 来 完成 。 图 片 属 性 的 设置 分 别 对 应 了 到 img 之 标记 的 不 同属 性 ,用 户 
可 以 通过 * 拆 分 ?或 “代码 ”视图 查看 生成 的 HTML 代码 。 此 外 ,将 图 片 直 接 插入 网 页 中 ,要 
进行 精细 的 布局 是 很 困难 的 ,要 对 网 页 进行 布局 ,通常 需要 使 用 表格 来 完成 。 


4.3.3 建立 超 链接 或 书签 


使 用 FrontPage 在 网 页 中 建立 超 链接 非常 简单 ,只 需要 选 定 超 链 接 的 文本 或 图 片 , 然 
后 , 单 击 工具 栏 中 的 “ 超 链接 ”按钮 , 即 可 打开 “插入 超 链 接 ” 对 话 框 ,从 中 输入 被 链接 的 URL 
即 可 。 


1. 定义 书签 


书签 是 文档 中 的 一 个 特定 标记 ,使 于 打开 网 页 定位 到 特定 的 位 置 。 使 用 FrontPage 在 
网 页 中 定义 书签 ,可 按照 下 面 步骤 操作 

在 网 页 中 选 定 文字 ,选择 “插入 ”一 “书签 "命令 ,打开 “书签 ”对话 框 ; 在 “书签 ”对 话 框 
中 ,显示 书签 名 称 和 网 页 中 已 经 定义 的 书签 列表 ,输入 书签 名 , 单 击 “ 确 定 ” 按 钮 , 即 可 定义 一 
个 书签 。 生 成 的 html 代码 形式 如 下 : 

<a name = "书签 名 "> 书签 文本 </a> 

在 定义 书签 时 ,可 以 不 选中 任何 文本 ,这 样 只 是 在 插入 点 处 定义 一 个 书签 。 

2. 文本 超 链 接 


使 用 FrontPage 在 网 页 中 建立 文本 超 链 接 的 操作 步骤 如 下 。 

(1) 选择 要 建立 超 链接 的 文本 。 

(2) 选择 “插入 ”一 “ 超 链 接 ” 命 令 , 或 直接 单 击 常用 工具 栏 中 的 “ 超 链接 ”按钮 ,打开 “ 插 
入 超 链接 ”对 话 框 ,如 图 4-13 所 示 。 

(3) 在 “链接 到 ”列表 框 中 ,有 四 种 主要 的 链接 到 目标 类 型 。 


第 4 章 “网 页 设计 与 制作 
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| @] 


desktop. ini 
taishal. jp 


图 4-13 “插入 超 链接 ”对 话 框 


@ 原 有 文件 或 网 页 : 通过 Web 浏览 器 查找 和 选择 被 链接 的 网 页 。 

@ 本 文档 中 的 位 置 : 链接 到 网 页 中 的 一 个 书签 ,通过 “选择 文件 ”对 话 框 在 本 地 机 上 查 
找 和 选择 被 链接 的 文档 。 需 注意 文件 和 被 链接 的 html 文档 之 间 的 路 径 问 题 。 

如 果 是 同一 个 Web 应 用 中 的 Web 页 面 ,必须 使 用 相对 路 径 ,方法 类 似 于 插入 图 片 。 如 
果 是 当前 Web 应 用 以 外 的 Web 页 面 , 需 要 给 出 完整 的 URL 地 址 。 

@ 新 建文 档 : 新 建 一 个 空白 文档 并 且 与 之 建立 超 链接 。 

@ 电子 邮件 地 址 : 与 一 个 E-mail 地 址 建立 超 链 接 。 

(4) 设置 目标 框架 和 书签 。 单 击 右 侧 的 “书签 ”按钮 ,可 以 显示 选择 的 网 页 中 定义 的 书 
签 。 单 击 右 侧 的 “目标 框架 "按钮 ,可 以 指定 单 击 超 链接 时 打开 网 页 的 窗口 ,分 别 对 应 二 a 二 
标记 中 的 target 属性 和 name 属性 。 

(5) 通过 “样式 ”按钮 ,可 以 设置 二 a 二 标记 的 用 户 自 定义 样式 类 class 属性 和 ID 属性 。 

当 上 述 设置 完成 后 , 单 击 * 确 定 ” 按 钮 ,完成 超 链接 的 建立 , 即 建立 一 个 文本 超 链接 。 自 
动 生 成 对 应 的 html 代码 ,形式 如 下 : 


<a href = "poems/wangyue. htm" target ="_blank" >« 望 月 »</a> 

当 文 本 对 应 一 个 超 链 接 时 ,文本 将 以 特殊 的 颜色 显示 , 超 链 接 文本 默认 显示 为 蓝 色 带 下 
划 线 的 文字 。 显 示 网 页 时 , 当 鼠 标 指 针 指 向 该 文本 时 ,指针 将 变 为 手 形 。 

3. 图 片 超 链 接 


使 用 FrontPage 也 可 以 为 图 片 建立 超 链接 ,具体 操作 步骤 如 下 : 
选中 将 要 建立 超 链接 的 图 像 ; 选择 “插入 ”一 “ 超 链接 ”命令 ,打开 “ 超 链接 ”对 话 框 , 接 下 
来 的 设置 与 文本 超 链接 的 操作 相同 。 


4.3.4 图 像 地 图 


在 HTML 规范 中 ,图 像 地 图 是 一 种 常用 的 页 面 导航 界面 ,对 于 热点 的 边界 点 (z,y) 坐 
标 , 手 工 定 义 几乎 不 可 能 ,因此 ,在 页 面 中 使 用 图 像 地 图 都 是 通过 FrontPage 等 页 面 制作 工 
具 完 成 的 。 使 用 FrontPage 建立 图 像 地 图 的 具体 步骤 如 下 。 
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(1) 选择 “插入 ”一 “图 片 ”>“ 来 自 文件 ”命令 ,插入 一 幅 图 片 。 
(2) 单 击 图 片 , 则 在 FrontPage 窗口 的 底部 显示 图 片 工 具 栏 。 如 果 不 显示 图 片 工 具 栏 ， 
可 在 图 片上 右 击 ,在 快捷 菜单 中 选择 “显示 图 片 工具 栏 ” 命 令 , 即 可 显示 “图 片 ” 工 具 栏 ,如 
图 4-14 所 示 。 


图 4-14 定义 图 像 地 图 


定义 图 像 的 热点 可 通过 “图 片 ” 工 具 栏 完成 ,其 中 有 4 个 定义 热点 的 工具 : 长 方形 热点 、 
圆 形 热点 、 多 边 形 热点 和 突出 显示 热点 。 

定义 热点 的 方法 很 简单 : 选中 图 像 , 这 时 上 述 的 4 个 工具 变 为 可 用 ; 然后 按 住 鼠 标 左 键 
在 图 像 上 的 目标 区 域 拖 动 即 可 。 对 于 多 边 形 热点 , 则 可 以 在 逐个 顶点 位 置 单 击 ,直到 形成 一 
个 封闭 的 区 域 为 止 。 热 点 区 域 建立 后 ,将 自动 打开 * 超 链接 ”对 话 框 , 从 中 输入 要 链接 的 
URL 即 可 。 

网 页 显示 时 ,图 像 上 的 热点 区 域 是 不 可 见 的 ,但 是 在 热点 设置 时 按 下 “图 片 ”工具 栏 中 的 
“突出 显示 热点 "按钮, 这样 在 显示 网 页 时 ,如 果 单 击 热点 区 域 ,可 以 看 到 区 域 的 外 框 。 

自动 生成 如 下 所 示 的 html 代码 : 

<map name = "FPMap0"> 

<area href = "city/beijing. htm" shape= "circle" coords = "286, 100, 17"> 

<area href = "city/jinan. htm" shape = "polygon" coords = "279, 129, 295, 111, 323, 122, 305, 

136, 287, 145"> 


</map> 
< img border = "0" src = "chinamap. gif" width = "433" height = "270" usemap = "#FPMap0"> 
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4.3.5 插入 表格 


在 网 页 设计 中 ,表格 不 仅 用 来 显示 数据 ,而 且 还 是 进行 网 页 布局 的 重要 手段 。 使 用 表 
格 ,可 对 各 种 网 页 元 素 的 位 置 进行 精确 控制 ,例如 文字 和 图 片 混 排 ,从 而 使 设计 的 网 页 布局 
整齐 、 美 观 。 

使 用 FrontPage, 在 网 页 中 插入 表格 ,可 以 按照 下 面 的 步骤 操作 。 

(1) 在 网 页 中 插入 表格 。 选 择 菜 单 “ 表 格 ”>“ 插 入 ”命令 ,打开 “插入 表格 ”对 话 框 ,从 中 
可 输入 要 插入 表格 的 行 数 和 列 数 ,设置 布局 .边框 .背景 等 属性 , 即 可 插入 一 个 表格 。 

(2) 表格 编辑 。 插 入 到 网 页 上 的 表格 ,可 以 进行 一 系列 的 编辑 操作 ,如 : 调整 行 高 和 列 
宽 , 单 元 格 的 合并 与 拆 分 ,删除 行 、 列 或 单元 格 , 插 入 行列 或 单元 格 等 。 

(3) 设置 表格 属性 。 将 插入 点 放 在 表格 当中 , 右 击 ,从 快捷 菜单 中 选择 “表格 属性 ” 命 
令 , 打 开 * 表 格 属性 ?对 话 框 , 如 图 4-15 所 示 。 


布局 工具 一 
加 局 用 布局 工具 ) 
加 禁用 布局 工具 区 ) 
旬 自动 启用 基于 表格 内 容 的 布局 工具 (1) 


EE | 


| 加 指定 宽度 生 ) 
〇 作案 
于 加 百分比 四 
口 指定 高 度 @) 
| 


休 素 名 


百分比 


图 4-15 “表格 属性 ”对 话 框 


在 “表格 属性 ”对 话 框 可 进行 以 下 几 个 方面 的 设置 。 

@ 布局 属性 : 包括 表格 的 对 齐 方式 、 表 格 宽度 、 单 元 格 间 距 (cellspacing) 、 单 元 格 衬 距 
(cellpadding)。 其 中 ,单元 格 间距 指 单元 格 之 间 的 距离 ,默认 值 为 2, 可 设 值 为 0; 单元 格 衬 
距 指 单元 格 中 文字 到 表格 线 的 距离 .默认 值 为 1。 

@ 表格 边框 设置 ,设置 表格 边框 的 粗细 和 颜色 。 

@ 表格 背景 ,可 以 设置 表格 所 用 的 背景 色 或 背景 图 片 。 
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在 网 页 中 ,如 果 要 使 表格 随 着 浏览 器 的 窗口 变化 而 变化 ,在 “表格 属性 ”对 话 框 中 ,选中 
“指定 宽度 ” 复 选 框 ,然后 选择 “百分比 ” 单 选 按钮 。 此 时 ,如 果 表 格 的 宽度 大 于 浏览 器 窗口 的 
宽度 时 ,表格 内 容 将 换行 ,可 能 影响 表格 的 外 观 。 如 果 在 “表格 属性 ”对 话 框 中 ,选中 “指定 宽 
度 " 复 选 框 ,并 且 选 择 “ 像 素 " 单 选 按钮 , 则 表格 的 显示 将 不 随 浏览 器 窗口 的 变化 而 变化 。 

(4) 设置 单元 格 属性 。 当 需要 对 单元 格 进行 特殊 设置 时 ,将 插入 点 放 到 单元 格 中 ,或 者 
选 定 要 设置 的 单元 格 , 右 击 , 从 快捷 菜单 中 选择 “单元 格 属性 ”命令 ,打开 “单元 格 属性 ”对 话 
框 ,从 中 可 以 对 一 个 单元 格 进 行 设置 ,这 些 设 置 将 影响 二 td 二 标记 的 属性 。 

通过 FrontPage 的 “ 拆 分 "视图 或 “代码 ”视图 ,可 以 看 到 生成 的 html 代码 ,表格 属性 和 
单元 格 属性 分 别 对 应 二 table 二 标记 ,二 tr 二 标记 以 及 二 td 放 标 记 的 有 关 属 性 。 

需要 特别 说 明 的 是 ,在 图 4-15 所 示 的 “表格 属性 ”对 话 框 中 , 单 击 左 下 角 的 “样式 ”按钮 ， 
可 以 设置 二 table 二 标记 的 样式 类 class 属性 和 id 属性 。 如 果 网 页 中 包含 css 文件 ,用 户 可 
以 选择 其 中 的 用 户 自 定义 样式 类 。 使 用 样式 类 (class 属性 ) 来 定制 table 的 外 观 是 一 种 良好 
的 页 面 制作 习惯 , 它 便 于 对 网 页 的 修改 ,但 是 这 却 是 许多 开发 人 员 忽 视 的 一 点 。 


4.3.6 插入 表单 


对 于 一 个 负责 用 户 交 互 的 网 页 ,其 主要 内 容 就 是 表单 。 使 用 FrontPage 在 网 页 中 插入 
表单 ,具体 操作 步 又 如 下 。 

(1) 选择 “插入 ”一 “表单 ”一 “表单 "命令 ,插入 一 个 表单 ,然后 依次 执行 要 插入 的 控件 
(表单 元 素 ) 命 令 , 以 便 在 表单 中 插入 需要 的 表单 元 素 。 

(2) 调整 表单 布局 。 表 单一 般 和 表格 联合 使 用 ,通过 表格 设置 表单 布局 。FrontPage 有 
时 候 使 的 这 些 标记 交叉 ,为 此 ,可 以 在 * 拆 分 ?或 “代码 ?视图 中 ,手工 调整 代码 。 例 如 ,将 
所 form 盖 二 /form 之 标记 对 调整 到 一 table 之 一/table 之 标记 对 的 外 面 。 

在 使 用 FrontPage 插入 表单 或 控件 时 ,如 果 插 入 了 多 个 过 form> 标 记 , 也 可 以 手工 删 
除 , 只 保留 一 个 二 form 二 二 /form 过 标记 对 ,手工 把 所 有 的 控件 标记 都 移动 到 二 form 二 
所 /form 二 内 部 。 

(3) 设置 表单 属性 。 在 表单 上 右 击 ,在 快捷 菜单 中 选择 “表单 属性 ”命令 ,打开 “表单 属 
性 ”对 话 框 ,如 图 4-16 所 示 。 


将 结果 保存 到 
加 发 送 到 G) 
六 Hs 条: [| 


电子 邮件 地 址 EE): 

〇 发 送 到 小 据 库 00 
合 发 送 到 其 他 对 象 他 ) | 自 定义 ISAFI、NSAFI、C6I 或 ASP 脚本 
表单 属性 
囊 单 名 称 加 nylogin 
目标 框 茶 TD) 


4-16 设置 表单 属性 
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在 “表单 属性 ”对 话 框 中 ,可 以 进行 各 种 设置 , 即 对 应 <form 二 标记 的 属性 设置 。 

(4) 设 管 表单 域 属性 。 在 表单 域 上 右 击 ,在 快捷 菜单 中 选择 “表单 域 属性 ”命令 ,打开 
“表单 域 属性 ”对 话 框 。 不 同类 型 的 表单 域 ,其 属性 对 话 框 也 不 相同 ,文本 框 控 件 对 应 的 表单 
域 属性 对 话 框 如 图 4-17 所 示 。 


myaccount 


guest 


医 E* 帮 vw] 厂 [取消 ] 


图 4-17 设置 表单 域 属性 


在 “表单 域 属性 ?对 话 框 中 ,输入 相应 的 属性 值 , 为 脚本 编程 需要 ,一 般 要 设置 表单 域名 
称 等 属性 ,最 后 单 击 “ 确 定 ” 按 钮 。 

当 表单 和 表单 域 属性 设置 结束 后 ,切换 到 “代码 ”模式 或 “ 拆 分 "模式 ,可 以 看 到 生成 的 
html 代码 ,如 图 4-18 所 示 。 


加 Wicrosoft FrontPage - D:\hao\login. htm 


size="20" value="guest” tabindex="1">/td> 


73") 入 和 nbsp; 码 Ytd> 
ext” nane="T2” size="20">Y/td> 


4 
Ydiv> 
nput type="subnit”value=" 提 交 ” nane="B1">Gnpat type="reset” value=“ 重 置 " name="B2">Gp> 
form> 
Ybody> 

Ea htnl> 


[as [ae | 


密码 | 


到 


口 设计 加 狂 交 | 晶 代 码 Q 预览 | 


图 4-18 插入 表单 及 其 属性 设置 
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4.3.7 插入 图 层 


图 层 是 HTML 中 重要 的 标记 ,在 FrontPage 中 ,选择 设计 视图 ,在 工具 栏 中 单 击 “插入 
层 ” 按 钮 , 即 可 通过 鼠标 在 页 面 上 创建 一 个 图 层 。 在 图 层 上 右 击 ,打开 快捷 菜单 ,选择 “ 层 属 
性 ”命令 ,在 右 侧 显示 “ 层 ” 面 板 , 从 中 可 以 进行 图 层 的 边框 和 底 纹 、 定 位 、 行 为 等 设计 ,如 
图 4-19 所 示 。 


加 Wicrosoft FrontPage - 
三 文件 到 ) ”编辑 EE) 视图 WD 插入 CD) 格式 0) 工具 0) 表格 全 ) 数据 加) 框架) 窗口 和 ”和 玫 助 和 D 
iD - 蕊 - 日 邹 如 | 周 -| 电 以- 移 |# 加 网 了 | 9- -| 个 回 太 国 司 | 多 | 日 | 中 广 时 和- 国 


;着 通 二 宋体 ”3 (042 态 ) <|BZ 0 i| 至 到 至 重 |AA Ea 


new page_1.hte 


new_page_1. hist 
区 要 
目 atm> 
2 
四 aead> 
国 meta http-eguiv= "Content- 
日 citle 洒 哇 问 页 1ctitiey 
站 wheaa> 
国 Goay> 
8 


iv :tm 
10 
1 


Type” content="text/htnl; charset=eb2312°> 


12 

Ybody> 

国 vhtnl> 

和 一 一 | 


yer1| 


图 4-19 插入 图 层 及 其 属性 设置 


(4.4 设置 标记 属性 
2 


在 HTML 规范 中 ,每 个 标记 都 含有 不 同 的 属性 ,通过 设置 标记 属性 可 以 修改 标记 的 默 
认 显 示 样 式 。 标 记 的 属性 众多 ,很 难 记忆 。 利 用 FrontPage. 在 “设计 ”视图 下 ,通过 一 些 标 
记 的 属性 对 话 框 可 以 进行 标记 的 属性 设置 。 除 此 之 外 ,还 可 以 在 “代码 ?视图 下 ,通过 
FrontPage 的 智能 感知 技术 设置 标记 属性 。 


4.4.1 使 用 属性 对 话 框 


在 现代 软件 中 ,对 于 每 一 个 对 象 ,无 论 是 操作 系统 级 的 对 象 ( 如 文件 夹 .文件 等 ) ,还 是 软 
件 系统 中 的 对 象 ,例如 FrontPage 设计 视图 下 的 各 个 标记 (例如 表格 、 单 元 格 、 表 单 、 输 入 
域 ) ,还 是 图 层 , 右 击 一 个 对 象 ,都 会 弹出 一 个 快捷 菜单 ,里 面包 含 了 当前 对 象 的 常用 操作 命 
令 , 这 就 大 大 地 方便 了 对 象 的 操作 。 
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在 FrontPage 中 ,设置 标记 属性 ,可 以 在 设计 视图 中 , 右 击 一 个 设计 对 象 ,在 快捷 菜单 中 
选择 “属性 ?命令 ,在 弹出 的 属性 对 话 框 中 进行 设置 ,这 种 设置 将 修改 代码 视图 中 生成 的 代 
码 , 即 修改 标记 的 属性 。 


4.4.2 IntelliSense 技术 


现在 大 多 数 的 开发 环境 都 使 用 智能 感知 (IntelliSense) 技 术 为 用 户 提供 帮助 。 所 谓 
IntelliSense, 是 指 当 用 户 编辑 到 一 个 对 象 时 ,系统 能 动态 地 显示 当前 对 象 的 方法 、 属 性 名 列 
表 , 从 而 保证 用 户 输入 的 正确 性 ,或 从 中 选择 输入 。 在 Boland 的 开发 环境 中 ,类 似 的 技术 称 
为 CodelInsight。 下 面 举例 说 明 。 

在 一 个 网 页 中 ,假定 要 设置 一 个 超 链接 的 属性 。 选 择 “ 代 码 " 视 图 ,将 插入 点 定位 到 二 a 
标记 , 按 空 格 键 , 则 自动 打开 一 个 窗口 ,显示 二 a 二 标记 的 所 有 属性 ,包括 一 般 属性 和 事件 属 
性 ,如 图 4-20 所 示 。 


BD privte 
DB insees 


国 leein htn 
ontent-Langu: 


国 twishan htn 四 weta http-e ‘ontent-Type” 
入 testl htn 
国 travelchins htn 


图 4-20 使 用 IntelliSense 技术 


现在 大 多 数 软 件 都 使 用 了 IntelliSense 技术 ,有 的 软件 默认 情况 下 不 打开 智能 感知 , 需 
要 对 软件 进行 设置 ,开启 IntelliSense 功能 。 


4.4.3 使 用 行为 面板 


标记 中 的 事件 属性 对 应 的 事件 ,又 称 为 行为 , 即 用 户 对 所 标记 对 象 的 操作 行为 。 每 个 行 
为 事件 往往 都 对 应 一 个 函数 , 即 标记 的 事件 属性 取 值 通常 是 一 个 函数 。 在 FrontPage 中 ,有 
许多 内 置 的 行为 函数 ,使 用 这 些 函 数 可 以 简化 用 户 的 编码 。 具 体操 作 如 下 。 
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(1) 要 设置 标记 的 行为 ,首先 选择 “设计 ”视图 ,选择 “格式 ”~“ 行 为 ”命令 ,打开 “行为 ” 


任务 面板 。 
(2) 单 击 “ 持 入 ”按钮 ,在 下 拉 列 表 中 ,可 以 选择 一 个 行为 。 则 在 下 面 的 事件 列表 中 , 显 
示 行为 对 应 的 默认 事件 。 


(3) 如 果 需 要 修改 行为 对 应 的 事件 ,可 以 单 击 事件 , 则 显示 当前 对 象 的 可 选 事 件 列 表 ， 
选择 一 个 事件 作为 当前 行为 的 激活 事件 即 可 。 
执行 以 上 操作 步骤 ,结果 如 图 4-21 所 示 。 


estl. htas 
Goal 


国 回 rivate 

国 回 images 
园 1o8in htn 
国 tsishan htn 
testl. htn 
travelching. htm 


让 评 | 日 拆 分 日 代码 Q 预 览 | 
一 


图 4-21 设置 标记 的 事件 属性 


转 到 “代码 ?视图 ,可 以 看 到 标记 中 增加 了 相应 的 事件 属性 ,并 可 以 看 到 自动 生成 的 脚本 
程序 代码 。 


人 5 定义 和 使 用 样式 


HTML 允许 用 户 在 标记 中 使 用 class 属性 修改 标记 的 默认 显示 样式 ,手工 定义 样式 需 
要 记 住 很 多 属性 及 取 值 ,非常 麻烦 。 在 FrontPage 中 ,提供 了 修改 样式 和 新 建 样式 类 的 功 
能 。 为 了 在 多 个 页 面 中 实现 样式 的 共享 ,可 以 将 用 户 自 定义 样式 存储 为 样式 表 文 件 。 


4.5.1 定义 样式 

如 果 要 在 一 个 网 页 中 使 用 样式 ,在 FrontPage 中 ,可 以 通过 选择 “格式 ”一 “样式 ”命令 来 
实现 ,具体 操作 步骤 如 下 。 

(1) 选择 “格式 ”样式 ”命令 ,打开 ”样式 "对话 框 ,如 图 4-22 所 示 。 

(2) 在 “列表 "下拉 列表 框 中 .可 以 选择 “用 户 自 定义 样式 ?或 者 "HTML 标记 ”。 
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段落 预览 
Ce De Dn i 
人 
a est 
dr 
er [于 香 预 窟 
button a 
fieldset 机 软 卓越 Aapbcc 
hi 
hz 
名 说明 
国 司 “修改 ”按钮 ， 为 当前 选取 的 JIWL 标记 创 
Mo 新 尘 ” 按 纪 可 他 了 娃 一 个 新 的 自 定义 样式 。 
[mm 标记 了 | 
户 定 


建 四 .| 亿 改 四 .| 加 | 
Cue |] ww | 
图 4-22 “样式 ”对 话 框 


@ 修改 html 标记 默认 样式 。 选 择 *HTML 标记 ”, 则 意味 着 修改 默认 样式 ,列表 中 将 
列 出 html 规范 的 所 有 标记 ,然后 选择 一 个 样式 , 单 击 * 修 改 " 按 钮 ,修改 所 选 的 样式 。 

@ 新 建 用 户 样式 类 。 选 择 “ 用 户 自 定义 样式 ”, 单 击 “ 新 建 " 按 钮 ,可 以 创建 一 个 新 的 样 
式 类 ,并 对 样式 进行 字体 等 属性 的 设置 。 

此 时 在 HTML 视图 中 ,将 看 到 文档 的 二 head 之 … 近 /head 之 内 部 生成 类 似 如 下 的 
代码 : 


<style> 

a:active { font— size:10pt; color: #0000FF } 

a:hover { font— size: 10px; color: #FF0000 } 

.Warning {font - family: 宋体 ; font - size: 8pt; color: #FF0000; font - weight: bold } 
</style> 


用 户 自 定义 样式 后 ,可 以 在 FrontPage“ 格 式 ” 工 具 栏 左边 的 样式 列表 中 显示 用 户 自 定 
义 的 样式 ,用 户 可 以 用 自 定义 样式 格式 化 网 页 中 的 文档 内 容 。 此 时 ,在 生成 的 HTML 代码 
中 看 到 相应 标记 内 增加 了 class 属性 ,例如 “二 p class 王 "warning" 二 注意 事项 : 一 /p 二 ”。 


4.5.2 使 用 样式 表 文 件 


在 网 页 内 定义 的 样式 ,只 是 用 于 网 页 内 部 。 为 了 实现 多 个 网 页 之 间 一 致 的 外 观 和 自 定 
义 样 式 的 共享 ,通常 需要 将 样式 定义 保存 为 . css 文件 ,这 样 多 个 网 页 就 可 以 共用 样式 ,保证 
网 站 中 网 页 风格 的 一 致 性 。 

建立 样式 表 文 件 (. css 文件 ) 有 两 种 方法 。 

(1) 选择 "文件 ”新 建 ? 命 令 ,打开 * 新 建 ? 任 务 窗 格 ; 单 击 “ 其 他 网 页 模板 ” 超 链 接 , 打 
开 “ 网 页 模板 ”对 话 框 (图 4-9); 选择 “样式 表 ” 选 项 卡 , 然 后 选择 一 个 样式 表 模 板 , 从 而 建立 
一 个 样式 表 文 件 。 接 下 来 ,通过 选择 “格式 ”一 “样式 ”命令 来 编辑 样式 即 可 。 

(2) 新 建 一 个 普通 的 页 面 文件 , 自 定义 样式 完成 后 ,删除 和 style 之 …</style 之 标记 对 
本 身 及 以 外 的 所 有 html 代码 ,只 保留 二 style 二 … 到 /style 二 标记 对 内 部 的 样式 定义 部 分 ， 
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然后 选择 “另存 为 ”命令 ,选择 保存 类 型 为 "css 文件 (. css)”。 

当 样 式 表 文 件 定义 完成 后 ,在 其 他 网 页 中 就 可 以 使 用 其 中 的 样式 了 。 选 择 " 格 式 ” 一 “ 样 
式 表 链 接 ” 命 令 ,打开 ”链接 样式 表 ” 对 话 框 ; 选择 一 个 . css 文件 ,例如 mystylesl. css, 则 在 
该 网 页 的 王 head 这 … 一 /head 一 内 增加 下 述 语句 : 

< link type = "text/css" rel = "stylesheet”href = "mystylesl. css"> 

注意 ,如 果 新 建 一 个 网 页 文件 ,在 没有 保存 前 ,格式 ”一 样式 表 链 接 ” 命 令 是 灰 化 的 ,无 
法 使 用 。 这 是 因为 ,网 页 在 存盘 前 ,无 法 确定 网 页 文件 和 要 引用 的 css 文件 的 相对 路 径 , 因 


此 不 能 使 用 css 文件 。 此 时 ,只 要 保存 一 下 网 页 文件 ,然后 “样式 表 链接 ”命令 就 可 以 使 
用 了 3 


@.6 Frame 


在 网 页 布局 设计 中 ,框架 网 页 是 经 常 使 用 的 一 种 网 页 类 型 , 它 可 以 把 浏览 窗口 分 成 几 个 
区 域 ,每 个 区 域 可 以 显示 一 个 不 同 的 页 面 , 即 对 应 一 个 单独 的 网 页 文件 。 


4.6.1 新 建 框 架 网 页 


在 FrontPage 2003 中 创建 框架 网 页 可 以 通过 专门 的 框架 网 页 模板 完成 ,方法 如 下 。 
(1) 选择 “文件 ”>“ 新 建 " 命 令 , 打 开 “ 新 建 "任务 窗 格 ; 在 新 建 网 页 区 域 , 单 击 * 其 他 网 
页 模板 ” 超 链 接 , 打 开 “ 网 页 模板 ”对 话 框 ,如 图 4-23 所 示 。 


选项 

器 妈 添加 网 站 任务 四) 

回 在 当前 的 框架 中 打开 人) 
说 明 


as 


一 一 


图 4-23 “网 页 模板 ”对 话 框 (2) 


(2) 选择 “框架 网 页 ”选项 卡 , 则 在 左 侧 列表 框 中 显示 多 个 框架 网 页 模板 的 图 标 , 单 击 其 
中 之 一 ,可 以 在 右 侧 的 预览 区 显示 该 模板 的 布局 样式 。 
(3) 双击 选中 的 模板 ,或 者 选中 模板 后 单 击 “确定 ”按钮 , 即 可 建立 相应 的 框架 网 页 ， 
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图 4-24 就 是 选中 “能 套 式 层 次 结构 "后 ,所 建 框架 网 页 的 初始 状态 。 


园 上 crosoft FrontPage - new page_1. 


rivete 
ep Ir 有 a6ammom | 
国 login htn 
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国 tsishan htm [ aan oD... 


国 testl.htm 


国 travelchina htm EC 


EEC) 医 EEERC 


[天 日 折 分 @ 无 框架 日 代码 品 预 咒 


图 4-24 新 建 框架 网 页 示例 


在 这 个 框架 网 页 中 ,浏览 窗口 被 分 成 了 3 个 框架 ,各 个 窗 格 显示 不 同 的 页 面 。 可 以 看 
到 ,初始 状态 下 每 个 框架 中 有 两 个 按钮 。 

@ 设置 初始 网 页 。 所 谓 初始 网 页 ,是 指 浏览 器 第 一 次 载 入 框架 网 页 时 该 框架 所 显示 的 
网 页 。 该 按钮 就 是 设置 一 个 已 经 存在 的 网 页 作为 该 框架 的 初始 网 页 。 单 击 时 可 以 打开 “ 创 
建 超 链接 ”对 话 框 ,选择 一 个 网 页 文件 或 输入 一 个 网 页 的 URL ,然后 单 击 “ 确 定 ” 按 钮 , 即 可 
以 在 当前 框架 中 打开 所 超 链接 的 网 页 文档 。 

@ 新 建 网 页 。 单 击 该 按钮 时 ,可 以 新 建 一 个 普通 的 网 页 (空白 页 ) 作 为 初始 网 页 。 

当 新 建 或 打开 一 个 框架 网 页 后 ,FrontPage 窗口 下 方 的 显示 模式 选项 标签 将 发 生 以 下 变化 : 

(1) 增加 了 “无 框架 "标签 。 当 浏览 器 不 支持 框架 网 页 时 所 要 显示 的 内 容 。 默 认 情 况 下 
将 显示 文本 “此 网 页 使 用 了 框架 ,但 您 的 浏览 器 不 支持 框架 ”。 

(2) 当前 网 页 为 框架 网 页 时 ,框架 ?菜单 中 的 命令 将 变 为 可 用 ,主要 包括 * 拆 分 框架 ”、 
“删除 框架 "“ 框 架 属 性 ?等 命令 。 


4.6.2 对 框架 的 常用 操作 


当 框 架 建立 后 ,可 以 对 框架 进行 以 下 操作 。 

。 拆 分 与 删除 框架 。 在 设计 视图 , 单 击 框架 ,在 “框架 "菜单 中 选择 相应 的 命令 。 

。 改变 框架 窗 格 的 大 小 。 将 鼠标 指针 指向 框架 , 当 指 针 变 成 te 形 或 者 1 形 时 , 按 住 
左 键 拖 动 ,达到 满意 的 位 置 后 松 开 。 

。 设置 框架 属性 。 和 鼠标 指针 指向 框架 , 右 击 ,从 快捷 菜单 中 选择 “框架 属性 ”命令 ,打开 
“框架 属性 ”对 话 框 ,从 中 进行 相应 的 设置 。 
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体 章 小 结 


本 章 首先 讨论 了 网 页 设计 的 概念 ,将 网 页 设计 分 为 面向 业务 逻辑 的 功能 性 设计 (交互 设 
计 ) 和 面向 用 户 体验 的 视觉 设计 两 个 不 同 的 层面 。 然 后 重点 讨论 了 面向 用 户 体验 的 页 面 布 
局 设计 ` 页 面 视觉 设计 和 页 面 效果 设计 的 有 关 问 题 。 然 后 对 FrontPage 工具 的 功能 和 使 用 
进行 了 较 详细 的 讲解 ,通过 FrontPage 的 各 菜单 命令 的 使 用 ,来 展示 了 网 页 制作 工具 在 网 页 
制作 上 的 作用 , 即 自动 生成 html 代码 ,从 而 提高 了 手工 编写 代码 的 效率 。 同 时 还 介绍 了 强 
大 的 IntelliSense 技术 的 使 用 。 最 后 介绍 了 在 FrontPage 中 创建 和 维护 css 样式 表 的 方法 ， 
以 及 框架 和 浮动 框架 的 使 用 。 


铝 题 4 


一 、 简 答题 

1. 在 进行 页 面 布局 设计 时 ,需要 考虑 哪些 因素 ? 请 上 网 进行 搜索 ,总 结 一 下 有 哪些 常 
用 的 网 页 布局 。 

2. 什么 是 页 面 视觉 设计 ? 有 哪些 主要 的 内 容 ? 

3. 简要 说 明 页 面 设 计 的 主要 步骤。 在 页 面 效果 设计 中 ,为 什么 要 进行 切 图 ? 

4. 要 对 Windows 平台 中 的 网 站 进行 远程 管理 ,应 如 何 设置 ? 

5. 对 于 FrontPage 工具 ,回答 下 列 问题 : 

(1) FrontPage 的 核心 功能 是 什么 ? 

(2) 在 FrontPage 中 ,设计 者 设计 “任务 窗 格 ” 的 初衷 是 什么 ?如 何 打开 或 关闭 ? 

(3) 在 FrontPage 的 “文件 "菜单 中 的 “打开 网 站 ”命令 的 功能 是 什么 ? 

(4) 在 Web 开发 中 ,网 页 制作 的 流程 应 该 是 : 先 打 开 网 站 ,然后 新 建 网 页 或 对 已 有 网 页 
进行 编辑 。 这 样 的 一 个 流程 反映 了 什么 思想 ? 

(5) 在 FrontPage 中 ,可 以 在 不 打开 网 站 的 情况 下 ,直接 新 建 一 个 网 页 吗 ? 

(6) FrontPage 设计 * 拆 分 ?视图 的 目的 是 什么 ? 

6. 怎样 在 HTML 文档 中 插 和 人 图片? 一 img> 标 记 的 常用 属性 有 哪些 ? 怎样 将 这 幅 图 
片 放 在 居中 位 置 ? 

7. FrontPage 中 不 同 的 显示 模式 各 有 什么 用 途 ? 

8. 在 “图 片 属性 ”对 话 框 中 可 以 进行 哪些 属性 的 设置 ? 怎样 将 图 片 设置 成 文字 环绕 的 
形式 ? 

9. 在 “表格 属性 ”和 “单元 格 属性 ”中 ,cellspacing 和 cellpading 分 别 代 表 什 么 意思 ? 

10. 如 何 设置 单元 格 内 容 和 单元 格 上 、 下 、 左 、 右 边框 的 距离 ? 

11. 在 FrontPage 中 ,针对 css 回答 下 列 问 题 : 

(1) 如 何 定义 一 个 css 文件 ? 

(2) 在 一 个 网 页 中 ,如 何 引 用 用 户 定义 的 css 文档 ? 

(3) 如 果 网 页 中 有 一 个 table, 要 设置 二 table 二 标记 的 class 属性 ,如 何 操 作 ? 
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12. 在 html 中 ,一 个 表单 的 一 form 之 一 /form 之 标记 对 将 产生 换行 ,如 果 使 用 表格 
(table) 进 行 页 面 布局 ,如 何 手工 调整 二 form 二 二 /form 二 标记 对 的 位 置 ? 

二 、 综合 设计 题 

利用 FrontPage、Photoshop 或 其 他 媒体 制作 和 页 面 制作 工具 ,结合 HTML 代码 的 手工 
调整 ,设计 并 制作 个 人 主页 ,具体 要 求 如 下 : 

(1) 个 人 主页 的 内 容 要 全 面 反映 个 人 相关 信息 。 

(2) 页 面 布局 .图 片 、 文 本 等 元 素 要 美观 大 方 。 

(3) 代码 简洁 。 

(4) 灵活 使 用 CSS, 便 于 代码 维护 。 

(5) 所 用 素材 和 页 面 文件 及 文件 夹 命名 规范 ,各 种 链接 使 用 相对 路 径 。 


客户 端 编程 | 


【本 章 导读 】 

网 页 不 仅仅 是 由 HTML 标记 构成 的 ,通常 还 包含 脚本 程序 ,它们 增加 了 页 面 的 交互 和 
计算 能 力 , 使 网 页 更 生动 、 功 能 更 强大 。 因 此 ,制作 网 页 除了 必须 掌握 HTML 的 各 种 标记 
外 ,还 应 该 熟悉 脚本 语言 编程 。 脚 本 语言 编程 包括 两 个 方面 ,一 方面 是 客户 端 编程 , 另 一 方 
面 是 Web 服务 器 端 编程 ,它们 分 别 在 Web 浏览 器 中 和 Web 服务 器 上 执行 。 

本 章 介绍 客户 端的 编程 问题 ,首先 讲解 Web 浏览 器 和 客户 端 脚本 程序 的 关系 ,对 浏览 
器 的 工作 原理 进行 分 析 , 它 是 理解 脚本 程序 和 脚本 编程 的 关键 ; 然后 以 JavaScript 语言 为 
例 ,讲解 客户 端 脚本 编程 问题 ,包括 JavaScript 程序 设计 语言 基础 事件 驱动 及 事件 处 理 、 对 
象 及 其 操作 、 常 用 内 部 对 象 及 函数 以 及 HTML 文档 对 象 模型 (DOM) ,根据 在 Web 开发 中 
的 具体 需求 ,详细 讲解 Web 开发 中 有 关 表 单 编程 中 遇 到 的 问题 ,包括 数据 的 获取 、 可 靠 性 验 
证 、 网 页 安全 以 及 网 页 间 的 参数 传递 ,并 提供 大 量 的 实用 代码 ; 最 后 给 出 多 个 综合 案例 。 

【知识 要 点 】 

5.1 节 : 计算 机 程序 程序 设计 语言 . 源 程序 解释 执行 .程序 编译 、 程 序 运行 。 

5.2 节 : 浏览 器 脚本 引擎 、 客 户 端 脚本 语言 JavaScript 脚本 语言 .JScript 脚本 语言 、 
<<script 二 标记 、 文 件 包 含 。 

5.3 节 : JavaScript 脚本 语言 基本 符号 、 数 据 类 型 、 弱 数据 类 型 变量 .运算 符 、 表 达 式 、 
程序 语句 ,顺序 语句 、 分 支 语句、 重复 语句 、 函 数 。 

5.4 节 : 类 、 对 象 \ 对 象 操作 、new 操作 。 

5.5 节 : JavaScript 内 部 对 象 、String 对 象 .RegExp 正则 表达 式 对 象 \Math 对 象 .Date 
对 象 .Array 数组 对 象 JavaScript 预定 义 函 数 。 

5.6 节 : 浏览 器 对 象 模型 (BOM) 、window 对 象 ,location 对 象 history 对象 .screen 对 
象 ,navigator 对 象 。 

5.7 节 : HTML 文档 对 象 模型 (DOMD) .document 对 象 \.body 对 象 .HTML 元 素 内 存 对 象 。 

5.8 节 : AJAX 技 术 、 客 户 端 和 服务 器 的 异步 通信 、 页 面 局 部 刷新 。 

5.9 节 : 折 胎 式 菜单 、 树 形 菜 单 、 数 据 有 效 性 验证 、 网 页 安全 。 


€.1 计算 机 程序 与 程序 设计 语言 


人 们 使 用 计算 机 ,确切 地 讲 , 是 使 用 计算 机 软件 。 计 算 机 软件 即 计算 机 程序 。 在 信息 社 
会 ,程序 不 应 该 是 一 个 深奥 的 专业 术语 , 随 着 软件 集成 开发 环境 的 发 展 , 编 程 也 不 再 是 专业 
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人 员 的 专利 ,程序 应 该 成 为 信息 社会 人 们 基本 信息 素养 的 一 部 分 。 
5.1.1 程序 设计 语言 


计算 机 程序 是 用 户 为 了 达到 某 种 目的 而 编写 的 可 以 控制 计算 机 和 运行 的 一 组 指令 序列 。 
程序 设计 语言 (Programming Language) 是 用 于 编写 计算 机 程序 的 语言 。 每 一 种 程序 设计 语言 
都 包括 语法 和 语义 两 个 方面 。 语 法 表示 程序 的 结构 或 形式 , 即 表示 构成 程序 的 基本 符号 、 符 号 
之 间 的 组 合 规则 。 语 义 表示 程序 的 含义 ,表示 按照 语法 规则 所 表示 的 各 种 书写 内 容 的 含义 。 

程序 设计 语言 很 多 ,但 程序 设计 语言 的 基本 成 分 都 是 相似 的 ,主要 包括 : 四 基本 符号 ， 
定义 语言 所 使 用 的 字符 集 、 保 留 字 ,标识 符 、 注 释 等 ; @ 数 据 和 数据 类 型 ,对 程序 所 处 理 的 数 
据 的 描述 ; @ 常 量 和 变量 ,声明 变量 ; @ 表 达 式 和 运算 符 , 数 据 处 理 规则 ; 加 基本 语句 ,分 为 
顺序 语句 、 分 支 语 句 和 重复 语句 ,表达 业务 逻辑 ; @ 函 数 , 实 现 模块 化 和 结构 化 编程 。 

对 于 程序 设计 语言 ,可 以 从 不 同 的 方面 进行 分 类 。 按 照 语言 级 别 可 以 分 为 低级 语言 
高 级 语言 。@ 低 级 语言 与 特定 的 机 器 有 关 , 功 效 高 ,但 使 用 复杂 。 低 级 语言 有 机 器 语言 和 汇 
编 语言 。 机 器 语言 是 基于 机 器 基本 指令 集 的 ,或 者 是 操作 码 经 过 符号 化 的 基本 指令 集 ; 汇 
编 语 言 是 机 器 语言 中 地 址 部 分 符号 化 的 结果 。 加 高 级 语言 是 一 种 更 加 符号 化 的 语言 ,接近 
于 自然 语言 ,和 机 器 基本 上 没有 紧密 关系 。 

现在 ,更 多 的 是 按 编程 思想 分 为 过 程式 程序 设计 语言 和 面向 对 象 的 程序 设计 语言 。 过 
程式 程序 设计 流行 于 20 世纪 90 年 代 以 前 , 自 顶 向 下 逐步 求 精 的 结构 化 程序 设计 是 软件 开 
发 的 主要 方法 ,直到 现在 ,这 种 结构 化 的 程序 设计 思想 仍然 被 广泛 地 采用 。Pascal、C、 
BASIC FORTRAN 等 高 级 语言 很 好 地 实现 了 结构 化 编程 的 思想 ,通过 过 程 和 函数 (又 称 子 
程序 ) ,把 一 个 复杂 的 问题 划分 成 几 个 相对 简单 的 子 问题 ,如 果子 问题 还 比较 复杂 ,再 继续 划 
分 ,最 后 将 划分 后 的 每 个 小 问题 用 过 程 和 邱 数 来 实现 。 

20 世纪 90 年 代 兴 起 的 面向 对 象 技术 对 人 们 近 半 个 世纪 来 的 软件 开发 思想 产生 了 深刻 
的 变革 。 这 一 技术 强调 利用 软件 对 象 进行 软件 开发 , 它 将 自然 界 中 的 物理 对 象 和 软件 对 象 
相对 应 ,建立 了 类 和 对 象 的 概念 。 在 面向 对 象 技术 中 ,不 仅 用 对 象 实现 了 数据 和 操作 的 封 
装 ,还 通过 消息 映射 在 事件 和 函数 之 间 进 行 关联 ,键盘 .鼠标 等 事件 的 发 生 会 发 出 消息 ,消息 
来 激活 函数 ,函数 之 间 的 联系 不 再 是 显 式 的 调用 ,这 样 就 降低 了 函数 的 耦合 度 。 对 于 复杂 系 
统 面向 对 象 技术 可 以 提高 系统 的 可 扩充 性 和 代码 重用 的 层次 。 当 前 流行 的 C++ 、Java 都 是 
典型 的 面向 对 象 程序 设计 语言 。 


5.1.2 程序 开发 及 其 运行 


用 计算 机 程序 设计 语言 编写 的 程序 称 为 源 程序 。 程 序 的 执行 分 为 解释 执行 和 编译 后 执 
行 两 大 类 。 解 释 执 行 就 是 在 某 个 环境 下 逐条 执行 程序 语句 , 当 遇 到 程序 错误 时 , 则 可 能 停止 
和 运行。 目前 ,网 页 中 的 客户 端 脚本 程序 就 是 由 Web 浏览 器 中 的 脚本 引擎 解释 执行 的 。 更 多 
的 计算 机 程序 采用 了 源 程 序 \ 编 译 、 连 接 到 运行 的 这 样 一 个 简单 的 开发 过 程 ,最 终 形成 一 个 
可 在 计算 机 操作 系统 上 运行 的 可 执行 文件 。 这 个 可 执行 文件 被 安装 在 计算 机 上 , 它 是 早期 
的 程序 主要 应 用 模式 ,同时 也 是 20 世纪 80 年 代 C/S 计算 模式 下 的 主要 应 用 形式 。 程 序 开 
发 过 程 如 图 5-1 所 示 。 
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编程 人 员 利 用 开发 工具 (如 Visual C++、MyEclipse 等 ) 来 编写 的 程序 ( 即 源 程序 ) ,然后 
对 源 程序 进行 编译 .连接 操作 ,最终 形成 一 个 可 执行 的 程序 , 即 一 个 exe 文件 。 这 种 开发 模 
式 一 直 影 响 到 C/S 计算 模式 ,直到 Web 的 出 现 , 一 种 基于 Web 服务 的 程序 开发 和 运行 模式 
开始 出 现 并 被 广泛 地 应 用 ,基于 Web 的 软件 开发 开始 成 为 程序 设计 和 应 用 的 主流 。 


和 | Pit | 
儿 源 程序 1 | | 目标 文件 中 
上 1 
1 1 1 1 
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1 1 1 
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图 5-1 早期 的 编译 型 计算 机 程序 开发 过 程 


6.3 浏览 器 与 客户 端 脚本 程序 


客户 端 脚本 程序 是 指 在 客户 的 浏览 器 中 运行 的 程序 ,这 种 程序 不 需要 事先 编译 。 如 果 浏 
览 器 从 服务 器 上 下 载 的 网 页 中 包含 客户 端 脚本 程序 ,浏览 器 将 对 脚本 程序 代码 进行 解释 执行 ， 
即 浏览 器 通过 自 带 的 脚本 引擎 对 HTML 文档 中 的 脚本 程序 进行 分 析 、 识 别 、. 解 释 并 执行 。 


5.2.1 浏览 器 与 客户 端 脚本 引擎 


浏览 器 之 所 以 能 够 解释 执行 网 页 中 的 客户 端 脚本 程序 ,是 因为 浏览 器 中 内 置 了 脚本 引 
擎 模块 ,可 以 解释 执行 网 页 中 的 客户 端 脚本 程序 。 客 户 端 脚本 程序 通常 是 用 脚本 程序 语言 
书写 的 ,脚本 程序 语言 和 传统 的 编译 型 程序 设计 语言 (如 C/C++ Java 等 ) 相 比 ,在 语法 结构 
上 类 似 , 最 大 的 不 同 是 脚本 程序 不 需要 编译 .连接 过 程 , 即 不 生成 在 操作 系统 下 运行 的 exe 
文件 ,而 是 直接 在 浏览 器 中 ,被 浏览 器 解释 执行 。 在 解释 执行 过 程 中 ,如 果 程 序 存在 错误 , 浏 
览 器 将 停止 程序 的 执行 ,并 在 浏览 器 窗口 的 状态 栏 中 显示 “网 页 存在 错误 ”的 提示 。 

由 于 安全 方面 的 原因 ,可 以 使 浏览 器 禁止 脚本 程序 的 运行 。 例 如 ,在 浏览 器 的 “Internet 
选项 ”对 话 框 中 ,选择 “安全 ”选项 卡 , 选 择 Internet, 单 击 * 自 定义 级 别 ”, 在 安全 设置 列表 中 ， 
可 以 在 “活动 脚本 ”中 选择 “禁用 ”“ 启 用 ”或 “提示 ”。 如 果 选 择 “ 禁 用 ”, 则 浏览 器 将 不 执行 网 
页 中 的 客户 端 脚本 程序 。 


5.2.2 脚本 语言 规范 与 主要 的 客户 端 脚 本 语言 
1995 年 年 末 , 网 景 公 司 (Netscape)? 发 布 了 其 客户 浏览 器 脚本 程序 语言 JavaScript。 随 
@ 美国 著名 的 浏览 器 厂商 ,1994 年 成 立 , 同 年 12 月 ,推出 第 一 款 商用 浏览 器 Navigator, 创 始 人 之 一 就 是 马克 … 安 


德 森 (Marc Andreessen) 。 在 微软 公司 进军 浏览 器 市 场 以 前 ,其 市 场 份额 一 度 达到 90% ,1998 年 11 月 24 日 ,AOL 公司 
收购 网 景 公司 。 
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后 ,Netscape 将 JavaScript 语言 规范 提交 给 欧洲 计算 机 制造 协会 (European Computer 
Manufacturing Association, ECMA) 进 行 审定 。1997 年 6 月 ,ECMA 发 布 了 名 为 ECMAScript 
Edition 1 的 脚本 语言 规范 , 即 ECMA-262。ECMAScript 不 与 任何 具体 浏览 器 相 绑 定 ， 
ECMAScript 描述 了 脚本 程序 语言 所 具有 的 通用 属性 ,包括 语法 、 类 型 .语句 \ 关 键 字 、 保 留 字 、 
运算 符 、 对 象 等 ,这 些 内 容 需 要 由 具体 的 浏览 器 实现 。 

1998 年 ,微软 公司 在 IE 4. 0 中 发 布 了 JScript 3. 0, 宣 称 成 为 第 一 个 遵循 ECMA 规范 来 
实现 的 JavaScript 脚本 引擎 。 一 年 后 ,Netscape 发 布 其 符合 ECMA 规范 的 JavaScript 1. 3。 
1999 年 12 月 ,ECMAScript 第 三 版 发 布 ,该 版 本 成 为 脚本 程序 语言 所 遵循 的 标准 ,目前 的 所 
有 脚本 语言 都 可 以 看 做 ECMAScript 规范 的 一 种 具体 实现 。 例 如 JavaScript 就 是 由 三 个 部 
分 组 成 的 , 即 ECMAScript 规范 ,文档 对 象 模 型 (DOM) 和 浏览 器 对 象 模型 (BOM) 。 

主要 的 客户 端 脚 本 语言 有 JavaScript .JScript 和 VBScript 等 ,其 中 ,JavaScript 是 最 早 
的 客户 端 脚本 语言 , 它 是 由 Netscape 随 着 其 Navigator 浏览 器 一 起 推出 的 ,是 浏览 器 默认 的 
脚本 程序 语言 。 后 来 微软 公司 开发 了 IE 浏览 器 ,为 了 在 下 中 支持 JavaScrip 脚本 程序 , 微 
软 公司 开发 了 一 个 类 似 的 脚本 语言 , 即 JScript。 可 以 说 ,在 正 浏览 器 中 ,JavaScrip 和 
JScript 是 等 价 的 ,两 者 在 语言 上 几乎 没有 什么 区 别 ,但 是 两 者 提供 的 对 象 差 别 较 大 。 

根据 HTML 规范 ,在 网 页 中 书写 脚本 程序 ,脚本 程序 应 该 书写 在 二 script>*… 达 /script 
标记 对 内 。 在 网 页 中 包含 脚本 程序 的 一 般 形式 是 : 

< script type = "value" language = "value"> 

语句 部 分 

</script > 

script 有 两 个 重要 属性 。QDtype 属性 ,规定 脚本 的 MIME 类 型 。MIME 类 型 由 两 部 分 
组 成 , 即 媒介 类 型 和 子 类 型 ,对 于 JavaScript 来 讲 , 其 MIME 类 型 为 text/JavaScript。type 
属性 标识 了 到 script 盖 … 到 /script 二 之 间 的 内 容 类 型 。@language 属性 ,用 于 设 定 脚本 程序 
语言 , 取 值 可 以 是 JavaScript、JScript、VBScript 等 ,如 果 是 JavaScript, 可 以 省 略 不 写 。 另 
外 ,在 language 参数 中 ,还 可 以 指定 脚本 语言 的 版 本 号 ,例如 : language 一 "Javascript 1. 3"。 

和 传统 的 程序 设计 一 样 ,在 JavaScript 编程 中 ,也 可 以 将 一 些 公用 的 函数 保存 为 独立 的 
文件 ,然后 在 其 他 的 网 页 中 ,在 二 head 二 一 /head 二 中 ,把 其 他 JavaScript 文件 包含 进来 ,一 
般 形 式 是 ， 


< script src = "include - filen— ame.js"></script> 


脚本 程序 可 以 出 现在 网 页 的 头 部 ,也 可 以 出 现在 网 页 的 文档 体 中 ,其 中 出 现在 文档 头 部 
的 脚本 程序 通常 是 一 些 函 数 , 这 些 函 数 只 有 在 显 式 地 被 调用 时 才 被 执行 。 在 介绍 具体 的 客 
户 端 脚本 程序 设计 以 前 , 先 看 两 个 包含 JavaScript 客户 端 脚 本 程序 的 简单 网 页 示例 。 

【 例 5-1】 编写 一 段 脚本 程序 ,检测 浏览 器 中 对 JavaScript 脚本 程序 的 支持 情况 。 

分 析 : 不 同 的 浏览 器 对 脚本 程序 的 支持 情况 不 同 ,下 述 代码 可 以 检测 浏览 器 对 
JavaScript 脚本 程序 不 同 版 本 的 支持 情况 。 

代码 清单 : exa5-1. htm 


<html> 
<head> 
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vt 


<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312"> 
</head> 
<body> 
<hl > JavaScript 检测 </hl >< hr> 
<! 一 JavaScript 支持 性 检测 一 > 
< script type = "text/javascript"> 
document. write(" 浏 览 器 支持 JavaScript!< br>< br>"); 
</script> 
<! 一 JavaScript 版 本 检测 一 > 
< script type = "text/javascript1.0"> 
document. write( "浏览 器 支持 JavaScript 1.0<br>"); 
</script > 
< script type = "text/javascript1.1"> 
document. write(" 浏 览 器 支持 JavaScript 1.1<br>"); 
</script> 


< script type = "text/javascript1.5"> 
document. write(" 浏 览 器 支持 JavaScript 1.5< br>"); 
</script> 
</body> 
</html > 


分 别 使 用 IE 6.0、Maxthon2( 邀 游 ); 和 Mozilla Firefox 2. 0 打开 上 述 网 页 文件 exa5-1. 
htm, 在 IE 6.0 和 Maxthon2( 邀 游 ) 浏 览 器 中 ,显示 浏览 器 支持 JavaScript 1.1、1.2 和 1.3， 
因为 Maxthon 浏览 器 采用 了 IE 内 核 , 因 此 ,两 者 对 于 JavaScript 版 本 的 支持 一 致 。 在 
Mozilla Firefox 2.0 浏览 器 中 ,显示 浏览 器 支持 JavaScript 1. 0 到 JavaScript 1. 5 的 全 部 
JavaScript 版 本 。 

和 所 有 的 软件 开发 一 样 , Web 页 面 中 的 程序 也 需要 对 程序 进行 结构 化 设计 。 在 
JavaScript 中 ,同样 提供 了 函数 定义 与 函数 调用 功能 ,以 支持 结构 化 程序 设计 。 由 于 浏览 器 
浏览 的 Web 页 是 顺序 地 从 Web 服务 器 调 出 ,并 由 浏览 器 解释 执行 的 ,函数 必须 遵循 先 定义 
(一 般 放 在 二 head 盖 … 王 /head> 内 ) 后 调用 (在 一 body 之 … 到 /body 二 内 ) 的 原则 。 

【 例 5-2】 编写 一 个 JavaScript 函数 , 求 一 个 正 整 数 的 阶乘 。 

分 析 : 模块 化 编程 同样 适用 于 脚本 程序 ,函数 可 以 写 在 HTML 页 面 的 任何 位 置 ,从 良 
好 的 编程 习惯 上 讲 ,函数 定义 通常 写 在 二 head 记 二 /head> 中 。 

代码 清单 : exa5-2. htm 


<html> 
<head> 
<meta http - equiv = "Content - Type" content = "text/html; charset = gb2312"> 
< script type = "text/javascript"> 
function fact(n) 
{ 
if (n== 0) 
return 1; 
else 
return nx fact(n— 1); 


} 


</script> 

</head> 

<body> 

<p>fact(5) = 

< script type = "text/javascript"> 
document. write(fact(5)); 

</script > 

</body> 

</html > 


在 浏览 器 中 打开 上 述 网 页 文件 ,在 浏览 器 中 显示 : 
fact(5) = 120 


JavaScript 程序 和 一 般 的 编译 型 程序 不 同 , 它 没有 一 个 操作 系统 调用 的 主 程序 (如 C 语 
言 中 的 main 〇 函数 ) ,一 个 JavaScript 函数 定义 时 并 不 发 生 作用 ,只 有 在 引用 时 (函数 定义 
后 的 document. write 语句 ) 才 被 激活 。 

因为 不 同 的 浏览 器 和 浏览 器 版 本 支持 的 脚本 语言 版 本 不 同 ,因此 ,在 书写 客户 端 脚本 程 
序 时 ,应 该 根据 浏览 器 的 种 类 和 版 本 ,使 用 合适 的 内 置 对 象 和 浏览 器 对 象 , 否 则 ,如 果 程 序 中 
使 用 了 一 些 高 版 本 脚本 语言 包含 的 对 象 , 则 网 页 在 不 支持 该 版 本 的 浏览 器 中 ,或 低 版 本 的 浏 
览 器 中 可 能 不 能 正常 地 显示 。 


G3 JavaScript 程序 设计 基础 


JavaScript 是 一 种 基于 对 象 .事件 驱动 的 浏览 器 脚本 编程 语言 。1995 年 ,Netscape 开始 
研发 一 种 开发 代号 为 “ 魔 卡 (Mocha) ”的 脚本 语言 ,根据 Netscape 的 Live 战略 ,该 语言 很 快 
更 名 为 LiveScript, 到 了 1995 年 年 末 ,为 了 迎合 市 场 对 Java 语言 的 热情 和 市 场 营销 的 需要 ， 
该 脚本 语言 正式 地 命名 为 JavaScript。 由 于 名 称 的 缘故 ,容易 使 人 们 将 JavaScript 和 Java 
联系 在 一 起 ,但 是 ,无 论 从 思想 和 应 用 环境 ,JavaScript 和 Java 语言 都 有 着 本 质 的 区 别 。 


5.3.1 JavaScript 基本 符号 


任何 一 种 程序 设计 语言 都 有 其 自身 的 字符 集 和 基本 符号 ,它们 按照 语法 构成 程序 语句 ， 
然后 语句 再 构成 程序 。 
1. 基本 字符 


JavaScript 语言 的 基本 字符 有 字母 (a、b、…、z,A、B、…、2) 、 数 字 (0、1、…、9) 和 特殊 符号 
《二 二 二 痉 于 ) 三 夫 关 ， 

同 C 语言 一 样 ,JavaScript 中 同样 以 反 斜 枉 (\) 开 头 来 表示 不 可 显示 的 特殊 字符 ,通常 
称 为 控制 字符 。 例 如 , \10' 表 示 换 行 (\n) ,人 13 ' 表 示 回 车 (\r) 。 

2. 关键 字 


关键 字 又 称 为 保留 字 , 它 是 由 字母 构成 的 具有 固定 含义 的 单词 ,如 var 代表 变量 说 明 ,if 
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表示 条 件 语句 等 。JavaScript 的 关键 字 很 多 ,可 以 参考 JavaScript 的 专门 书籍 。 
需要 特别 注意 的 是 ,JavaScript 是 识别 大 小 写 的 ,在 JavaScript 中 ,关键 字 需 要 小 写 ,如 
果 书 写 有 误 , 将 显示 “JavaScript 脚本 错误 ”的 警告 。 


3. 标识 条 


标识 符 是 指 表示 常量 、 变 量 和 函数 等 名 称 的 符号 。 标 识 符 分 为 标准 标识 符 和 用 户 自 定 
义 标识 符 。 标 准 标 识 符 是 表示 标准 常量 和 标准 函数 等 名 称 的 符号 。JavaScript 中 的 标准 常 
量 和 标准 函数 见 下 面 的 介绍 。 用 户 自 定义 标识 符 是 指 用 于 说 明 常量 、 变 量 和 函数 等 名 称 的 
符号 。 用 户 自 定义 标识 符 必 须 以 字母 开始 ,由 任意 的 字母 .数字 和 “_” 组 成 。 用 户 在 命名 标 
识 符 时 应 该 有 一 定 的 命名 规范 。 第 一 ,用 户 自 定义 标识 符 不 应 该 与 标准 标识 符 重 名 。 第 二 ， 
用 户 自 定义 标识 符 要 尽 可 能 反映 它 所 代表 的 对 象 的 含义 。 如 : 用 Name 代表 名 称 比 用 x 代 
表 名 称 可 读 性 更 强 。 第 三 ,如 果 是 一 个 变量 名 ,还 应 该 尽 可 能 反映 变量 的 数据 类 型 和 作用 
域 ,如 用 nUserID 表示 一 个 用 户 标识 ,最 前 面 的 小 写字 母 n 代表 变量 为 整数 类 型 。 第 四 ,大 
小 写 混 写 和 较 长 的 标识 符 可 以 把 含义 表达 得 更 清晰 。 总 之 ,好 的 命名 规范 可 以 提高 程序 的 
可 读 性 ,便于 程序 的 维护 。 


4. 注释 


为 了 增加 程序 的 可 读 性 ,一般 在 程序 中 增加 注释 语句 ,注释 内 容 没 有 语法 要 求 , 其 内 容 
仅仅 起 提示 作用 。 在 JavaScript 中 ,注释 以 “//” 字 符 引 导 , 注 释 可 以 单独 一 行 ,也 可 以 在 语 
旬 行 的 后 面 。 

注释 一 般 分 为 序言 性 注释 和 描述 性 注释 两 种 类 型 。 序 言 性 注释 出 现在 模块 的 首部 ,其 
内 容 一 般 包括 有 关 模 块 功能 的 说 明 、 界 面 描述 、 调 用 语句 格式 、 所 有 参数 的 解释 和 该 模块 需 
调用 的 其 他 模块 名 等 。 还 包括 一 些 重 要 变量 的 使 用 .限制 及 其 他 信息 。 描 述 性 注释 典 在 程 
序 之 中 。 描 述 性 注释 又 有 功能 性 的 和 状态 性 的 ,功能 性 注释 说 明 程序 段 的 功能 ,通常 可 放 在 
程序 段 之 前 ; 状态 性 注释 说 明 数 据 的 状态 ,通常 可 放 在 程序 段 之 后 。 

需要 说 明 的 是 ,与 HTML 的 注释 (所 !--…- -全 ) 不 同 , 当 在 服务 器 端 处 理 脚本 时 ， 
JavaScript 中 注释 将 被 删除 , 而 不 是 被 送 到 浏览 器 。 若 需要 客户 端 浏览 器 看 到 脚本 中 的 注 
释 , 应 该 使 用 HTML 注释 ,将 注释 加 进 HTML 页 。 此 时 ,注释 将 返回 给 浏览 器 。 


5.3.2 数据 和 数据 类 型 


在 程序 设计 中 ,数据 类 型 就 是 定义 一 段 计 算 机 内 存 空 间 的 解析 规则 ,说 明 变量 就 是 要 说 
明 变 量 名 称 及 其 数据 类 型 。 数 据 类 型 决定 了 变量 所 占 内 存 空间 的 大 小 ,同时 也 决定 了 变量 
的 取 值 范围 。 对 于 程序 中 声明 的 全 局 变量 ,程序 在 运行 时 ,操作 系统 会 为 其 分 配 空间 。 直 到 
程序 运行 结束 ,所 占用 的 内 存 空 间 被 释放 。 

JavaScript 脚本 程序 语言 是 一 种 解释 性 的 程序 语言 ,所 写 的 脚本 程序 不 需要 编译 和 链 
接 , 它 采用 边 读 边 执行 的 方式 运行 。 在 数据 类 型 方面 ,JavaScript 提供 了 三 种 基本 的 数据 类 
型 用 来 处 理 数字 和 文本 。JavaScript 提供 的 数据 类 型 有 数值 (整数 和 实数 ) .字符 串 型 (用 西 
文 双 引 号 “"” 或 西 文 单 引号 “'” 括 起 来 的 字符 ) 、 布 尔 型 (true 和 false, 均 为 小 写 ) 。 

JavaScript 采用 弱 类 型 的 形式 ,没有 预定 义 的 类 型 名 ,变量 不 必 事 先 声 明 其 数据 类 型 ， 
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可 以 在 使 用 或 赋值 时 确定 其 数据 类 型 。 此 外 ,一 个 变量 的 类 型 在 使 用 时 还 可 以 被 改变 。 通 
常情 况 下 ,可 以 先 给 变量 赋 一 个 初 值 ,通过 初 值 的 类 型 来 声明 该 变量 的 数据 类 型 ,这 更 加 符 
合 一 般 的 程序 设计 思想 ,例如 : 


var x = "hello"; 


上 述 语句 声明 了 一 个 变量 x, 通 过 为 x 赋 初 值 "hello" ,将 x 作为 一 个 字符 串 类 型 变量 。 
在 后 面 的 语句 中 ,可 以 给 x 赋 一 个 整数 ,如 x 二 100, 这 样 变量 x 就 成 为 整数 类 型 了 。 在 
JavaScript 中 ,上 述 变 量 类 型 的 改变 不 会 和 其 他 程序 设计 语言 一 样 出 现 赋值 不 相 容 的 错误 。 

不 同 的 数据 类 型 之 间 可 以 进行 转换 ,例如 : 将 字符 串 转 换 为 相应 的 整数 ,将 整数 转换 为 
字符 串 数 据 等。 这 些 转 换 被 封装 在 相应 的 类 或 对 象 中 ,字符 串 到 数值 的 转换 函数 可 见 5. 5. 1 
节 的 String 对 象 。 如 果 是 数值 型 转换 为 字符 串 ,最 简单 的 方法 就 是 将 一 个 字符 串 和 数值 做 
“十 ”运算 ,结果 即 为 字符 串 类 型 。 例 如 : 

var age = 18; 

var agestr =age * 2+""; 

上 述 代码 ,第 一 个 语句 设置 age 为 整数 ,第 二 个 语句 agestr 则 为 字符 串 。 通 过 整数 和 一 
个 字符 串 , 例 如 空 串 相 加 , 即 可 得 到 字符 串 。 


5.3.3 常量 和 变量 
1. 常量 和 常量 定义 


常量 是 指 在 程序 运行 过 程 中 ,其 值 不 发 生变 化 的 量 。 常 量 有 字面 常量 和 符号 常量 两 种 。 
字面 常量 就 是 一 些 数值 或 字符 串 , 例 如 3. 14、"hello" 等 都 是 字面 常量 。 根 据 数据 类 型 的 不 
同 ,常量 可 分 为 整数 常量 .实数 常量 .字符 常量 等 。 字 符 型 常量 是 指使 用 单 引号 ('") 或 双 引号 
(") 插 起 来 的 一 个 或 多 个 字符 。 如 'a'、"hello"、"5123"、"x 十 y" 等 ,其 中 单 引 号 括 起 来 的 为 单 
个 字符 , 双 引 号 括 起 来 的 为 字符 串 。 符 号 常量 是 指 为 一 个 常量 起 一 个 名 字 , 即 常量 名 ,常量 
名 是 一 个 用 户 自 定义 标识 符 。 例 如 : 用 pi 代表 圆周 率 3. 14。 

常量 命名 有 两 方面 的 好 处 ,首先 恰当 的 常量 名 称 可 以 增加 程序 的 可 读 性 ; 其 次 ,使 用 常 
量 名 便于 程序 的 维护 。 例 如 ,可 以 命名 常量 pi 二 3. 14 ,如果 和 希望 提高 求解 精度 ,可 以 修改 pi 
的 定义 为 pi 二 3. 1416, 这 种 修改 只 在 一 处 进行 ,不 会 产生 不 一 致 的 情况 ,而 且 修改 简单 。 


2. 变量 和 变量 说 明 


变量 是 指 在 程序 执行 过 程 中 其 值 发 生变 化 的 量 。 每 一 个 变量 都 有 一 个 变量 名 ,对 应 一 
个 特定 的 内 存 空间 。 变 量 有 两 个 重要 的 属性 ,一 个 是 数据 类 型 ,一 个 为 操作 运算 。 数 据 类 型 
决定 了 变量 所 占 内 存 空间 的 大 小 ,也 决定 了 数据 的 取 值 范围 和 操作 运算 。 

在 JavaScript 中 ,变量 命名 的 一 般 形式 是 : 


var < 变量 名 表 >; 


其 中 ,var 是 JavaScript 的 保留 字 , 表 明 接 下 来 是 变量 说 明 ,变量 名 表 是 用 户 自 定义 标识 
符 ,变量 之 间 用 逗号 分 开 。 和 C/C++ 等 程序 设计 语言 不 同 , 在 JavaScript 中 ,变量 说 明 不 需 
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要 给 出 变量 的 数据 类 型 。 此 外 ,变量 也 可 以 不 说 明 而 直接 使 用 。 例 如 : 
Var x,y; 


定义 了 两 个 变量 ,名 称 分 别 为 x 和 y, 没 有 给 出 具体 的 数据 类 型 ,也 没有 赋予 其 值 。 
再 如 : 


var myName = "John" 


定义 了 一 个 变量 myName, 同 时 赋予 了 它 一 个 字符 串 值 。 在 JavaScript 中 ,变量 可 以 不 
作 声 明 ,在 使 用 时 ,数据 的 类 型 将 确定 变量 的 类 型 。 


3. 变量 的 作用 域 


变量 的 作用 域 由 声明 变量 的 位 置 决定 ,决定 哪些 脚本 命令 可 访问 该 变量 。 在 函数 外 部 
声明 的 变量 称 为 全 局 变量 ,其 值 能 被 所 在 HTML 文件 中 的 任何 脚本 命令 访问 和 修改 。 在 
函数 内 部 声明 的 变量 称 为 局 部 变量 。 只 有 当 函 数 被 执行 时 ,变量 被 分 配 临 时 空间 ,函数 结束 
后 ,变量 所 占据 的 空间 被 释放 。 局 部 变量 只 能 被 函数 内 部 的 语句 访问 ,只 对 该 函数 是 可 见 
的 ,而 在 函数 外 部 则 是 不 可 见 的 。 


5.3.4 表达 式 和 运算 符 


表达 式 是 指 将 常量 ,变量 函数、 运算 符 和 括号 连接 而 成 的 式 子 。 根 据 运算 结果 的 不 同 ， 
表达 式 可 分 为 算术 表达 式 ( 结 果 为 整数 或 实数 )、 字 符 表达 式 ( 结 果 为 字符 或 字符 串 ) 和 逻辑 
表达 式 ( 结 果 为 true 或 false) 。 

JavaScript 提供 了 丰富 的 运算 功能 ,包括 算术 运算 .关系 运算 、 录 辑 运算 和 连接 运算 等 。 


1. 算术 运算 符 


JavaScript 中 的 算术 运算 符 有 单 目 运算 符 和 双 目 运算 符 。 双 目 运算 符 包括 十 (加 ) .一 
( 减 )、x ( 乘 )、/( 除 )、%( 取 模 )、|( 按 位 或 )、&( 按 位 与 )、 二 二 ( 左 移 )、 二 ( 右 移 ) 等 。 单 
目 运算 符 有 一 ( 取 反 )、 一 ( 取 补 )、 十 十 ( 递 加 1)、 一 一 (递减 1) 等。 


2. 关系 运算 符 


关系 运算 又 称 比 较 运算 ,关系 运算 符 包 括 志 (小 于 )、 雪 =( 小 于 等 于 )、 >( 大 于 )、 > 一 
(大 于 等 于 ) .一 (等 于 ) 和 ! 王 (不 等 于 ) 。 
关系 运算 的 运算 结果 为 布尔 值 ,如 果 条 件 成 立 , 则 结果 为 true, 和 否则 为 false。 


3. 逻辑 运算 符 
逻辑 运算 符 有 &( 逻 辑 与 )、| (逻辑 或 )、! ( 取 反 ,逻辑 非 ) “(人 逻辑 异 或 )。 
4. 连接 运算 符 


连接 运算 用 于 字符 串 操作 ,连接 运算 符 有 十 (用 于 强制 连接 ) ,将 两 个 或 多 个 字符 串 连 接 
为 一 个 字符 串 。 
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5. 三 目 操作 符 
三 目 操作 符 *?:? 格 式 为 ， 
操作 数 ? 表 达 式 1: 表达 式 2 


三 目 操作 符 *?:” 构 成 的 表达 式 , 其 逻辑 功能 为 : 若 操作 数 的 结果 为 true, 则 表述 式 的 结 
果 为 表达 式 1, 和 否则 为 表达 式 2。 例 如 max=(a>b)? a:b; 该 语句 的 功能 就 是 将 a,b 中 的 较 
大 的 数 赋 给 max。 


5.3.5 基本 语句 


所 有 的 程序 设计 语言 ,无 论 是 过 程式 程序 设计 语言 还 是 面向 对 象 的 程序 设计 语言 ,其 程 
序 设计 语句 都 可 以 分 为 三 种 类 型 , 即 顺序 语句 、 分 支 语句 和 重复 语句 ,使 用 这 三 种 语句 就 可 
以 描述 用 户 的 所 有 业务 逻辑 。 


1. 顺序 语句 


从 本 质 上 讲 , 在 一 个 程序 中 ,语句 总 是 从 上 而 下 顺序 执行 的 。 在 过 程式 的 程序 设计 语言 
中 ,这 种 顺序 是 程序 本 身 所 显 式 地 定义 的 。 例 如 CC 语言 中 的 函数 调用 , 遇 到 函数 调用 , 转 去 
执行 相应 的 函数 ,执行 结束 后 返回 。 在 面向 对 象 的 程序 设计 语言 中 ,函数 的 调用 变 得 更 加 复 
杂 , 它 是 在 程序 的 运行 过 程 中 ,由 事件 触发 消息 ,由 消息 来 激活 函数 。 这 样 的 事件 驱动 机 制 ， 
使 函数 的 调用 变 得 不 再 像 过 程式 程序 设计 中 的 显 式 调用 那么 清晰 ,但 这 种 消息 映射 
(message map) 机 制 降低 了 郴 数 之 间 的 耦合 度 , 大 大 增强 了 软件 系统 的 可 维护 性 。 在 函数 
内 部 ,语句 仍然 是 从 上 到 下 顺序 执行 的 。 

无 论 是 CC++ 、Java, 还 是 JavaScript, 由 于 语句 语法 的 需要 ,有 时 候 需 要 将 多 个 语句 看 
做 逻辑 上 的 一 个 语句 ,此 时 需要 将 这 多 个 语句 用 一 对 花 括 号 "{” 和 *) 括 起 来 ,语句 之 间 用 分 
号 分 开 , 称 为 语句 块 。 在 语句 块 内 部 ,语句 从 上 而 下 顺序 执行 。 


2. 分 支 语句 


在 JavaScript 中 ,实现 分 支 结构 的 语句 有 三 种 ,它们 是 条 件 判断 语句 让 语 句 .if…else… 语 
句 和 开关 语句 switch 语句 。 

1) 计 语 句 

站 语 句 的 一 般 形式 是 : 

if (< 条 件 表达 式 > ) 

< 语句 >; 

证 语句 首先 计算 条 件 表达 式 的 值 , 若 计算 结果 为 true, 或 非 0 值 的 数 ,包括 正 数 或 负数 ， 
则 执行 语句 部 分 ,否则 执行 计 语 句 下 面 的 语句 。 计 语句 逻辑 功能 如 图 5-2 所 示 。 

语句 部 分 逻辑 上 是 一 个 语句 ,如 果 语 句 部 分 需要 多 个 语句 来 实现 ,应 将 这 多 个 语句 用 
“{” 和 “})” 括 起 来 ,形成 语句 块 , 作 为 逻辑 上 的 一 个 语句 。 例 如 : 


if (a>=b) 
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2) if*…else… 语 句 
if…else… 语 句 先 计算 条 件 表达 式 的 值 ,根据 计算 结果 确定 要 运行 的 语句 。 一 般 形 
式 是 : 
证 (< 条 件 表达 式 > ) 
< 语句 1>; 


else 


< 语句 2>; 
if…else*… 语 句 首 先 计算 条 件 表达 式 的 值 ,车 为 true, 或 非 0 值 的 数 , 则 执行 语句 1, 否 
则 ,执行 语句 2。 逻辑 功能 如 图 5-3 所 示 。 


ET Ra 
true( 非 0 值 ) 


语句 1 语句 2 


下 面 的 语句 下 面 的 语句 
图 5-2 让 语 句 逻辑 功能 图 5-3 ”if…else… 语 句 逻 辑 功 能 


在 存在 两 种 分 支 的 情况 下 ,if…else… 语 句 可 以 很 好 地 描述 这 种 迎 辑 。 在 多 种 分 支 的 情 
况 下 ,可 以 使 用 if…else… 语 句 的 嵌 套 进行 描述 ,但 是 府 套 降低 了 程序 的 可 读 性 。 为 此 ,对 于 
多 种 分 支 的 情况 ,JavaScript 提供 了 switch 语句 。 

3) switch 语句 

switch 语句 提供 了 if…else… 多 层 嵌 套 结构 的 一 种 变通 形式 ,可 以 从 多 个 语句 块 中 选择 
执行 其 中 的 一 个 。switch 语句 提供 的 功能 与 if…else… 语 句 类 似 ,但 是 可 以 使 代码 更 加 简练 
易 读 。 

switch 语句 的 一 般 形式 为 : 


switch (< 数值 或 字符 串 表达 式 >) 
{ 
case 表达 式 1 
语句 块 1; 
[break; ] 
case 表达 式 2 
语句 块 2; 
[break; ] 


Case 表达 式 n 
语句 块 n; 
[break; ] 


[default: 
语句 块 n+ 1; 
] 
上 
在 switch 语句 的 开始 是 一 个 条 件 表 达 式 ,该 条 件 表 达 式 可 以 是 一 个 整数 、 实 数 或 字符 
串 表达 式 。 表 达 式 的 结果 将 与 结构 中 每 个 case 的 表达 式 值 比较 。 如 果 匹 配 , 则 执行 与 该 
case 关联 的 语句 块 。 在 语句 块 中 ,如 果 包 含 break 语句 , 则 退出 switch 语句 ,否则 ,将 继续 下 面 
的 case 匹配 。switch 语句 的 逻辑 功能 如 图 5-4 所 示 。 其 中 虚线 或 框 为 可 选 语句 及 流程 。 


条 件 表达 式 


语句 块 1 | 一 break 本 


匹配 表达 式 2 


false 


-=--1 
语句 块 上 二 break 上 
人 过 J 


1 语句 块 n+11 1 


1 

1 

1 

ee 

语句 块 2 | = break 上 -| 
bs J 1 
1 

1 

1 

1 

1 

1 

1 

1 

1 

1 

1 

1 


下 面 的 语句 
图 5-4 ”switch 语句 逻辑 功能 


3. 重复 语句 


当 部 分 语句 需要 反复 执行 时 ,需要 使 用 重复 语句 。 重 复 语句 总 是 由 循环 体 和 循环 终止 
条 件 两 部 分 组 成 。 在 JavaScript 中 可 使 用 下 列 两 种 形式 的 重复 语句 。 

1) while 循环 语句 

while 循环 语句 是 先 判断 循环 终止 条 件 ,然后 再 执行 循环 体 , 因 此 循环 体 可 能 一 次 也 不 
被 执行 。while 循环 语句 的 一 般 形式 是 : 

while (< 条 件 表达 式 >) 

< 语句 >; 

首先 计算 条 件 表达 式 的 值 , 若 计算 结果 为 true, 或 非 0 的 数 , 则 执行 循环 体 语句 ,然后 无 
条 件 地 返回 while 语句 的 开始 位 置 ,继续 计算 条 件 表达 式 的 值 。 如 果 条 件 表 达 式 计算 的 结 
果 为 false, 则 结束 循环 .执行 while 循环 语句 下 面 的 语句 。 逮 辑 功 能 如 图 5-5 所 示 。 

2) for 循环 语句 

一 般 形式 为 : 


for (表达 式 1; 表达 式 2; 表达 式 3) 
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< 语句 >; 

执行 过 程 如 下 。 

(1) 计算 表达 式 1。 

(2) 计算 表达 式 2, 如 果 结 果 为 true, 或 非 0 值 , 则 执行 循环 体 ,然后 转 Step3。 否 则 , 结 
东 循 环 。 

(3) 计算 表达 式 3。 

(4) 无 条 件 转 步 骤 (2) 。 

(5) 循环 结束 ,执行 for 语句 下 面 的 语句 。 

逻辑 功能 如 图 5-6 所 示 。 


表达 式 1 
false(0 值 
| A se(0 值 ) 
~ true( 非 0 值 ) 
true( 非 0 值 ) 语句 
y 1 
语句 
表达 式 3 
I 
下 面 的 语句 下 面 的 语句 
图 5-5 while 语句 逻辑 功能 图 5-6 for 语句 逻辑 功能 


在 for 语句 中 ,表达 式 1、 表 达 式 2 和 表达 式 3 可 以 省 略 其 中 的 一 个 或 多 个 ,但 它们 之 间 
的 分 号 不 能 省 略 。 例 如 ,可 以 写成 下 面 的 for 语句 形式 : 


for (; ;) 

{ 

} 

上 述 for 语句 是 一 个 死 循环 ,在 循环 体 中 必须 包含 break 语句 ,以 结束 循环 的 执行 。 另 
外 ,循环 体 的 内 部 也 可 以 包含 循环 语句 ,构成 多 重 循环 , 即 循环 的 嵌 套 。 需 要 特别 注意 关键 
字 要 小 写 ,例如 for 不 应 该 写成 For。 

4. break 和 continue 语句 


与 C++ 语言 相同 ,使 用 break 语句 使 得 程序 执行 从 for 语句 或 while 语句 中 跳出 ， 
continue 使 得 跳 过 循环 内 剩余 的 语句 而 进入 下 一 次 循环 。 


5.3.6 函数 


在 结构 化 程序 设计 中 ,函数 是 实现 结构 化 程序 设计 的 主要 手段 , 它 把 一 个 系统 中 需要 反 
复 多 次 执行 的 部 分 定义 为 一 个 函数 。 如 判断 一 个 数 是 否 为 素数 、 求 两 个 数 的 最 大 公约 数 等 。 
在 JavaScript 语言 中 ,已 经 给 出 了 许多 标准 函数 ,同时 也 允许 用 户 自己 定义 函数 。 
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在 JavaScript 中 ,函数 是 以 function 开头 定义 的 ,由 函数 头 部 和 函数 体 构成 。 一 般 形 
式 为 : 

function < 函数 名 > (< 形式 参数 表 >) 

{ 

变量 说 明 部 分 ; 
语句 (函数 体 ); 

} 

在 函数 的 定义 中 ,函数 名 后 有 形式 参数 表 , 这 些 形式 参数 变量 可 能 是 一 个 或 几 个 ,在 
JavaScript 中 可 通过 “函数 名 . arguments. Length? 来 检查 参数 的 个 数 。 在 函数 体 中 ,可 以 分 
为 变量 说 明和 语句 部 分 ,变量 说 明 用 于 说 明 该 函数 所 要 处 理 的 数据 ,语句 部 分 是 对 变量 的 处 
理 。 在 JavaScript 中 ,由 于 采用 弱 数 据 类 型 ,变量 说 明 部 分 可 以 省 略 不 写 。 在 函数 体 的 语句 
部 分 必须 包含 一 个 返回 函数 值 的 语句 , 即 return 语句 。 


6.4 类 与 对 象 


在 软件 系统 的 开发 中 ,面向 对 象 的 程序 设计 是 目前 最 主流 的 程序 设计 思想 ,大 部 分 的 软 
件 开 发 工具 也 是 面向 对 象 的 ,例如 C++ Java 等 。 面 向 对 象 的 思想 将 问题 域 中 的 每 一 个 实 
体 都 映射 为 软件 系统 中 的 一 个 对 象 ,通过 类 和 对 象 , 实 现 了 数据 和 数据 操作 的 封装 , 极 大 地 
增强 了 系统 的 灵活 性 、 可 维护 性 和 可 扩展 性 。 


5.4.1 类 与 对 象 的 概念 


类 (Class) 和 对 象 (Object) 是 面向 对 象 程序 设计 (Object Oriented Programming, OOP) 
的 灵魂 。 所 谓 * 类 ”, 是 指 一 种 包含 成 员 变量 和 成 员 函 数 的 数据 结构 。 类 和 传统 的 过 程式 程 
序 设 计 中 的 数据 类 型 相似 , 它 不 占用 内 存 空间 ,主要 目的 是 用 于 声明 对 象 。 对 象 是 用 类 来 声 
明 的 数据 结构 ,如 果 将 类 比 作 数据 类 型 ,对象 就 是 相应 数据 类 型 的 变量 ,在 内 存 中 分 配 特定 
的 空间 存储 数据 ,类 决定 了 对 该 空间 的 语义 解析 。 

JavaScript 并 不 是 一 个 完整 的 面向 对 象 的 程序 设计 语言 , 它 不 提供 关于 对 象 的 抽象 . 封 
装 .继承 派生、 多 态 等 功能 。 但 它 可 以 使 用 浏览 器 的 内 置 对 象 , 也 允许 用 户 自 定义 对 象 ,从 
而 分 享 面向 对 象 程序 设计 带 来 的 好 处 。 

因为 JavaScript 是 一 种 基于 对 象 的 程序 设计 语言 ,理论 上 讲 ,JavaScript 并 没有 定义 类 
的 功能 。 在 JavaScript 中 ,所 谓 定义 “类 ”, 其 实 是 一 种 模拟 的 自 定义 类 型 。 有 两 种 常见 的 形 
式 , 介 绍 如 下 。 


1. 利用 函数 构造 类 


利用 函数 构造 类 的 方式 和 “函数 ”定义 的 语法 相同 ,而 且 这 样 的 函数 成 为 该 类 的 构造 函 
数 。 用 户 用 函数 定义 来 定义 类 ,然后 用 new 语句 创建 该 类 的 一 个 实例 (对 象 )。 一 般 形 
式 是 : 


function className(< propl, prop2, …>) 
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this. propl = propl; // 属性 
this. prop2 = prop2; 


this. method1 = FunctionNamel; // 方法 ,需要 定义 对 应 的 函数 
this. method2 = FunctionName2; 


} 
上 述 定义 即 定 义 了 一 个 名 为 className 的 类 , 它 包 含 的 属性 为 propl,prop2,…, 包 含 


的 成 员 函 数 是 methodl ,method2 ,…。 


2. 利用 原型 prototype 定义 类 


在 JavaScript 中 ,类 是 以 函数 的 形式 来 定义 的 。 每 个 类 对 象 都 有 一 个 prototype 属性 对 
用 户 可 以 向 对 象 的 prototype 属性 添加 属性 和 方法 。 
例如 ,为 JavaScript 内 置 对 象 添 加 方法 : 


< script lanuage = "javascript"> 
Array. prototype. max = function() 
{ 

var i, max = this[0]; 

for (i=1; i< this.1length; i++) 

{ 

if (max < this[i]) 
max = this[i]; 

} 

return max; 
} 


</script > 
删除 String 对 象 两 侧 的 空格 ,代码 如 下 : 


String. prototype. trim() 
{ 

return this. replace(/(^\s+)|(\s+ $)/g, ""); 
} 


除了 可 以 为 内 置 对 象 添加 属性 和 方法 外 ,可 以 为 用 户 定义 的 类 添加 方法 ,示例 代码 


如 下 : 


function TestObject(name) 
{ 
this.m name = name; 
} 
TestObject. prototype. ShowName = function() 
{ 
alert(this.m name); 
} 


上 述 代码 定义 了 一 个 类 TestObject, 包 含 一 个 属性 m_name, 一 个 方法 ShowName()。 
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MY 


【 例 5-3】 定义 一 个 JavaScript 类 ,包含 一 个 成 员 变 量 、 三 个 成 员 函 数 , 并 用 不 同 的 方法 
定义 成 员 函 数 , 比 较 它们 的 不 同 。 

分 析 : 在 JavaScript 中 ,可 以 使 用 function 定义 类 。 对 类 成 员 函 数 可 以 用 不 同 的 方法 
定义 ,不 同方 法 定义 的 函数 不 同 。 

代码 清单 : 


< htm]l > 
<head> 
< script language = "javascript"> 
function f1() 
{ 
return this.m name; 
} 
A 
// 定 义 TestObject 类 
function TestObject(name) 
{ 
this.m name = name; 
// 成 员 函 数 定义 方法 1 
this. f1 = £1; 
// 成 员 函 数 定义 方法 2 
this. f2 = function() 
{ 
document. write("this. f2()<br>"); 
} 
} 
// 成 员 函 数 定义 方法 3 
TestObject. prototype. ShowName = function() 
{ 
document. write(this.m_name+ "<br>"); 
} 
</script > 
<head> 
<body> 
< script language = "javascript"> 
a= new TestObject("0bj A"); 
b= new TestObject("0bj B"); 


a. ShowName( ) ; 
b. ShowName( ) ; 


document. write(a.fl == b. f1); 

document. write(a.f2 == b. £2); 

document. write("< br >"); 

document. write(a. ShowName == b. ShowName) ; 
</script> 

</body> 

</html > 


在 上 述 代码 中 ,在 页 面 的 头 部 定义 了 一 个 JavaScript 类 TestObject, 用 三 种 方法 定义 了 
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三 个 成 员 函 数 fl()、f2() 和 ShowName()。 在 页 面 的 二 body 之 体内 ,声明 了 两 个 对 象 a 和 
b。 在 浏览 器 中 打开 该 页 面 ,显示 结果 如 下 : 

ObjA 

obj B 

true 

false 

true 

从 上 述 输出 结果 可 以 看 出 ,三 种 方法 定义 的 成 员 函 数 不 同 ,如 果 在 类 的 定义 中 骨 入 函数 
定义 (方法 2) ,不 同 的 实例 对 象 将 拥有 独立 的 成 员 函 数 副 本 。 使 用 prototype 定义 的 成 员 琐 
数 (方法 3) ,所 有 对 象 拥有 同一 个 成 员 函 数 。 

此 外 ,不 同方 式 定 义 的 成 员 函 数 ,JavaScript 解释 引擎 搜索 的 顺序 也 不 相同 ,具体 过 程 
是 : JavaScript 解释 引擎 在 处 理 "." 或 "[keyName]" 引 用 的 对 象 的 属性 和 方法 时 , 先 在 对 象 
本 身 的 实例 (this) 中 查找 , 如 果 找 到 就 返回 或 执行 。 如 果 没 有 找到 ,就 查找 对 象 的 
prototype, 查 看 是 否定 义 了 被 查找 的 对 象 和 方法 ,如 果 找 到 就 返回 或 执行 ,如 果 没 有 查找 
到 ,就 返回 undefined( 对 于 属性 ) 或 runtime error( 对 于 方法 )。 


5.4.2 对象 操作 


无 论 是 Ct+/Java 等 面向 对 象 的 程序 设计 语言 ,还 是 JavaScript 这 样 基 于 对 象 的 程序 设 
计 语 言 ,定义 类 的 目的 是 说 明 对 象 ,对 象 实现 数据 的 存储 ,类 只 是 定义 了 对 象 的 数据 结构 和 
内 存 解析 规则 。 


1. 创建 对 象 

创建 对 象 就 是 按照 类 的 定义 在 内 存 中 分 配 一 段 空 间 ,并 为 该 空间 命名 。 在 JavaScript 
中 ,使 用 new 运算 符 可 以 创建 一 个 新 的 对 象 。 创 建 对 象 的 一 般 形式 是 : 

myobj = new calssName( 人 参数 表 ) 


其 中 ,myobj 为 创建 的 对 象 名 称 ,calssName 是 类 的 名 称 , 参 数 表 用 于 激活 类 的 相应 的 
构造 函数 ,从 而 为 类 中 的 成 员 变 量 赋值 。 
如 创建 一 个 日 期 对 象 ,代码 为 : 


myDate = new Date( ); 
myBirthday = new Date("May 11,1975 6:15:00"); 


这 样 就 创建 了 两 个 新 的 日 期 对 象 myDate 和 myBirthday,myDate 对 象 取 当 前 的 计算 机 
时 钟 作为 其 日 期 值 ,而 第 二 个 Date 对 象 myBirthday 被 赋值 一 个 具体 的 日 期 。 


2. 访问 对 象 属性 和 方法 
对 象 属 性 和 方法 的 引用 主要 使 用 点 (. ) 运 算 符 ,一 般 形式 为 : 
对 象 名 .属性 名 | 方法 名 

或 : 


对 象 名 [属性 名 | 方法 名 ] 


3. for…in 语句 

格式 如 下 : 

for( 对 象 属性 名 in 已 知 对 象 名 ) 

顺序 输出 对 象 各 个 属性 的 值 ,如 果 是 方法 , 则 输出 对 应 的 函数 代码 。 例 如 : 


function showData( object) 
{ 
for(var prop in object) 
document. write(object[prop]); 


F 


使 用 该 函数 时 ,在 循环 体 中 ,可 以 不 知道 对 象 属性 的 个 数 ,for 可 以 自动 地 将 属性 取出 
来 ,直到 最 后 为 止 。 


4. this 关键 字 


this 是 对 当前 对 象 的 引用 ,在 JavaScript 中 ,对 象 的 引用 是 多 层次 的 ,往往 一 个 对 象 的 
引用 又 需要 对 另 一 个 对 象 的 引用 ,而 另 一 个 对 象 有 可 能 又 要 引用 另 一 个 对 象 , 这 样 有 可 能 造 
成 混乱 ,为 此 JavaScript 提供 了 一 个 用 于 指定 当前 对 象 的 指针 this。 
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每 一 种 程序 设计 语言 都 可 以 分 成 程序 设计 语法 和 标准 库 两 部 分 。 语 法 部 分 通常 用 于 定 
义 一 种 程序 语言 的 基本 语法 规范 ,包括 字符 集 、. 保 留 字 、 数 据 和 数据 类 型 程序 语句 等 内 容 ; 
标准 库 则 是 指 为 用 户 提 供 的 一 组 常用 函数 库 或 类 库 。 对 于 结构 化 程序 设计 语言 (如 C 语 
言 ) ,标准 库 通 常 是 一 组 标准 的 函数 库 ,包含 大 量 的 标准 函数 。 如 果 是 面向 对 象 的 程序 设计 
语言 (例如 C++ 、Java 等 ) ,标准 库 则 是 一 组 标准 类 库 . 包 含 大 量 的 标准 类 。 使 用 标准 函数 库 
或 类 库 ,可 以 提高 用 户 的 编程 效率 和 保证 程序 代码 质量 。 

由 于 JavaScript 是 一 种 基于 对 象 的 脚本 程序 设计 语言 , 它 具 有 面向 对 象 程序 设计 语言 
的 特点 ,但 又 不 完全 是 面向 对 象 的 程序 设计 。 这 体现 在 关于 类 库 的 设计 方面 ,例如 
JavaScript 不 仅 提供 了 一 组 标准 类 库 , 同 时 还 提供 了 一 组 常用 的 对 象 和 全 局 函数 。 而 在 面 
向 对 象 的 程序 设计 思想 中 ,尽量 不 使 用 全 局 对 象 变量 ,所 有 的 函数 都 应 该 隶属 于 一 个 类 。 不 
同 的 JavaScript 版 本 ,包含 的 内 部 对 象 和 函数 也 不 一 样 ,下 面 介绍 一 些 常用 的 内 部 对 象 和 
函数 。 


5.5.1 String 对 象 


在 JavaScript 中 ,每 个 字符 串 都 是 一 个 String 对 象 。 使 用 String 对 象 时 ,不 需要 像 一 般 
自 定义 对 象 一 样 用 new 关键 字 在 内 存 中 创建 对 象 ,而 是 可 以 直接 将 一 个 字符 串 赋 给 一 个 变 
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量 。string 字符 串 对 象 封 装 了 JavaScript 中 的 字符 串 以 及 相关 的 操作 。 
字符 串 对 象 的 生成 十 分 简单 ,而 且 是 隐 式 的 ,不 使 用 new 关键 字 , 例 如 : 


Var myStr = "Hello"; 


这 样 ,myStr 就 是 字符 串 对 象 了 ,一 个 变量 被 声明 为 字符 串 对 象 之 后 , 它 就 拥有 了 这 个 
对 象 类 的 属性 和 方法 ,可 以 和 一 般 对 象 一 样 ,使 用 对 象 的 方法 ,取得 对 象 的 属性 。 


1. 字符 串 对 象 的 属性 


字符 串 对 象 的 属性 只 有 一 个 


,这 就 是 length( 长 度 ) 属 性 ,返回 字符 串 的 长 度 。 需 要 说 明 


的 是 ,如 果 字 符 串 为 英文 ,那么 长 度 属性 的 值 是 字母 个 数 加 上 特殊 符号 个 数 ,加 上 空格 数 ; 
但 是 如 果 字 符 串 是 中 文 , 每 个 中 文 单字 占 两 个 英文 字符 的 长 度 。 例 如 : 


< script type = "text/javascipt"> 


var myStr = "Hello"; 


document. write(myStr. length) ; 


</script> 


上 述 代码 在 浏览 器 中 输出 字符 串 "Hello" 的 长 度 为 5。 


2. 字符 串 对 象 常用 方法 


字符 串 对 象 是 使 用 最 为 频繁 的 对 象 , 因 此 也 包含 更 多 的 常用 对 象 成 员 函 数 。 常 见 的 


String 对 象 成 员 函 数 见 表 5-1。 


函数 及 一 般 形 式 


表 5-1 String 对象 常 用 成 员 函 数 


功 能 


charAt(Position) 


取 字 符 函 数 ,返回 字符 串 对 象 中 下 标 为 Position 的 字符 (Position 
为 大 于 等 于 0, 且 小 于 字符 串 长 度 的 整数 ) 


substring( Position] , Position2) 
substring( Position) 


第 一 种 格式 中 ,返回 下 标 从 Positionl 到 Position2 之 前 的 字符 串 
(不 会 下 标 是 Position2 的 字符 )。 第 二 种 格式 返回 下 标 为 Position 
开始 直到 字符 串 结束 的 字符 串 


indexOf(subStr) 
indexOf(subStr,StartPosition) 


subStr 是 一 个 待 查找 的 字符 或 者 字符 串 , 可 以 是 常量 ,也 可 以 是 变 
量 。 在 省 略 StartPosition 的 情况 下 ,此 函数 将 从 字符 串 的 第 一 个 
字符 开始 查找 ; 当 StartPosition 参数 存在 的 情况 下 ,这 个 函数 将 从 
字符 串 中 下 标 为 StartPosition 的 字符 开始 查找 ; 当 StartPosition 
超过 字符 串 的 长 度 时 ,返回 一 1。 当 所 希望 查找 的 字符 串 找 不 到 
时 ,返回 一 1。 当 字符 串 中 有 两 个 以 上 的 待 查找 字符 串 , 则 返回 被 
搜寻 字符 串 中 位 置 在 最 前 面 的 待 查 字符 串 的 下 标 位 置 


lastIndexOf (subStr) 
lastIndexOf (subStr, StartPosition) 


同 indexOfQ 〇 函数 类 似 , 只 是 查找 是 从 字符 串 尾部 往 前 查找 


match(searchvalue) 


match(regexp) 


在 字符 串 内 检索 指定 的 值 ,或 找到 一 个 或 多 个 与 正则 表达 式 的 匹 
配 。 参 数 searchvalue 规定 要 检索 的 字符 串 值 。 参 数 regexp 为 正 
则 表达 式 。 如 果 没 有 找到 任何 匹配 的 文本 ,match() 将 返回 null。 
否则 , 它 将 返回 一 个 数组 ,其 中 存放 了 与 它 找到 的 匹配 文本 有 关 的 
信息 
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续 表 


函数 及 一 般 形式 功 能 


将 字符 串 中 的 字 串 strl 用 str2 替换 ,同时 replace() 支 持 正则 表达 
式 , 它 可 以 按照 正则 表达 式 的 规则 匹配 字符 或 字符 串 

将 字符 串 中 所 有 的 字母 变 为 小 写字 母 ,将 变化 后 的 结果 返回 。 但 
是 , 原 字符 串 内 的 大 小 写 不 变 

将 字符 串 中 所 有 的 字母 变 为 大 写字 母 ,将 变化 后 的 结果 返回 。 但 
是 , 原 字 符 串 内 的 大 小 写 不 变 

将 字符 串 分 割 为 字符 串 数组 ,并 返回 此 数组 。separator 为 分 隔 符 ， 
limit 为 可 选 参数 ,分割 的 次 数 ,如 果 无 此 参数 为 不 限制 次 数 
length() 返回 字符 串 的 长 度 , 所 谓 字符 串 的 长 度 是 指 其 包含 的 字符 的 个 数 


replace(str] , str2) 


toLowerCase() 


toUpperCase() 


split(separator, limit) 


JavaScript 提供 了 大 量 的 字符 串 处 理 函 数 ,功能 非常 强大 ,下 面 是 几 个 简单 的 例子 。 例 
如 ,在 HTML 的 多 行文 本 框 输入 中 ,包含 了 回 车 换行 符 , 如 果 要 保存 到 数据 库 中 , 则 回 车 换 
行 无 法 保存 ; 如 果 要 将 数据 库 内 容 显示 , 则 没有 换行 。 因 此 ,在 保存 数据 库 时 可 以 将 文本 框 
中 的 回 车 换行 蔡 换 为 HTML 的 二 br 二 标记 。 代 码 如 下 : 

// 设 字符 串 保 存在 变量 str 中 ,删除 其 中 的 回 车 .换行 符 

str = str. replace(/\r/g, "<br>"); 

str = tstr. replace(/\n/g,""); 

上 述 代码 使 用 了 正则 表达 式 ,“\r" 表 示 回 车 字符 ,“/g” 表 示 全 部 ,即将 str 中 全 部 的 “\r” 
替换 为 二 br 二 。 第 二 行 则 表明 将 全 部 的 换行 “\n" 替 换 为 空 , 即 删除 。 如 果 要 将 全 部 的 字符 
“a” 替 换 为 “A”, 可 写 为 str 二 tstr. replace(/a/g,"A");。 

字符 串 的 打 散 也 是 常用 的 操作 之 一 。 例 如 : 

var strl = "aa;bb;cc"; 

var str2 = "hello"; 

S1 = str. split(";"); 

s2= str. split(""); 

则 得 到 一 个 字符 数组 s1==["aa","bb", "cc"],s2==["h","e","l","l","o"]。 

与 split 对 应 的 函数 是 Array 对 象 的 join(delimiter) 方 法 ,使 用 给 定 的 分 隔 符 将 一 个 数 
组 合并 为 一 个 字符 串 。 例 如 : 

var aa = new Array("jpg", "bmp", "gif", "ico", "png"); 

var str = aa. join("|"); 


则 字符 串 portableList 为 “jpglbmp|gif|ico| png”。 
5.5.2 RegExp 对 象 


在 字符 串 处 理 中 ,经 常会 用 到 查找 某 种 特定 模式 的 字符 串 ,或 者 是 验证 某 个 字符 串 是 否 
符合 特定 的 格式 。 例 如 ,检查 一 个 字符 串 是 否 为 有 效 的 邮箱 地 址 ,检查 用 户 名 是 否 字 母 和 数 
字 的 组 合 等 。 用 来 描述 这 种 复杂 规则 的 表达 式 称 为 正则 表达 式 (Regular Expression)。 在 
JavaScript 中 ,RegExp 对 象 表示 正则 表达 式 , 它 是 对 字符 串 执行 模式 匹配 的 强大 工具 。 使 
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用 正则 表达 式 , 可 以 大 大 减少 字符 串 处 理 的 编程 工作 量 , 使 数据 有 效 性 验证 更 加 准确 和 
高 效 。 


1. 正则 表达 式 的 概念 


正则 表达 式 的 概念 最 初出 现 于 理论 计算 机 科学 的 自动 控制 理论 和 形式 语言 理论 中 ,是 
用 于 对 模型 和 规则 的 一 种 形式 描述 ,20 世纪 50 年 代 , 正 则 表达 式 的 概念 被 应 用 于 UNIX 的 
编辑 器 工具 软件 ,随后 被 普及 开 来 。 许 多 程序 设计 语言 都 支持 利用 正则 表达 式 进 行 字符 串 
操作 。 

正则 表达 式 是 一 种 由 普通 字符 和 特殊 字符 (元 字符 ) 组 成 的 字符 串 匹 配 模 式 , 在 正则 表 
达 式 中 ,元 字符 (Metacharacter) 是 拥有 特殊 含义 的 字符 。 正 则 表达 式 只 能 使 用 “/” 开 头 和 
结束 ,不 能 使 用 双 引 号 ,因为 双 引号 是 字符 串 对 象 的 表示 方法 。 

在 JavaScript 中 ,正则 表达 式 中 可 以 使 用 的 元 字符 及 其 含义 见 表 5-2。 


表 5-2 ”JavaSeript 正则 表达 式 元 字符 


元 字符 含义 元 字符 含义 

5 匹配 除 换行 符 以 外 的 任意 字符 NO 匹配 NUL 

\d 匹配 数字 \r 匹配 回 车 符 

\D 匹配 非 数 字 字 符 \n 匹配 换行 符 

\s 匹配 空白 字符 \t 匹配 制 表 符 

\S 匹配 非 空白 字符 \v 匹配 垂直 制 表 符 

匹配 一 个 字母 .数字 或 下 划 线 等 单词 \ 匹配 换 页 符 

字符 

匹配 方 括号 之 间 的 任何 字符 ,字符 范 

ANW 匹配 非 单词 字符 [] 围 可 以 用 “-” 连 接 , 例 如 [abcd] 可 以 写 
为 [a-d] 

\b 查找 处 在 单词 的 开始 或 结束 处 的 匹配 [ll 匹配 不 在 方 括号 之 间 的 任何 字符 

\B 查找 不 在 单词 开始 或 结束 处 的 匹配 (和 ) | 指定 子 表达 式 , 用 于 分 组 


在 表 5-2 中 ,所 谓 “ 匹 配 ”, 就 是 指 子 字 符 串 符合 某 种 条 件 ( 正 则 表达 式 ) ,通常 是 指 这 个 
字符 串 中 有 一 部 分 (或 几 部 分 分 别 ) 能 满足 正则 表达 式 给 出 的 条 件 。 另 外 ,空白 字符 是 指 空 
格 符 (space character) 、 回 车 符 (carriage return character) ,换行 符 (new line character) 、 
制 表 符 (tab character) 、 垂 直 制 表 符 (vertical tab character) 、 换 页 符 (form feed 
character) 。 

如 果 要 查找 元 字符 本 身 的 话 ,比如 查找 字符 “. "或 “ * ”, 应 使 用 转 义 字符 。 转 义 字符 使 
用 ”“\"* 开 始 , 用 于 取消 紧 跟 在 后 面 的 字符 的 特殊 意义 。 因 此 ,要 查找 字符 “. 或“ * ”, 应 该 使 
用 \. 和 \ x* 。 要 查找 “\” 字 符 本 身 , 可 使 用 \\。 

例如 : myfile\. dat 匹配 myfile. dat,D:\\GPMS3 匹配 D:\GPMS3。 

在 正则 表达 式 中 ,还 会 遇 到 重复 的 情况 ,这 需要 使 用 量词 (限定 符 ) 来 指定 重复 的 数量 。 
常用 的 限定 符 见 表 5-3。 


表 5-3 常用 的 限定 符 


量词 /语法 说 有 明 

nx 匹配 任何 包含 零 个 或 多 个 n 的 字符 串 。 例 如 : /lo * /g, 在 字符 串 中 查找 包含 0 个 或 多 
个 “o" 的 字符 串 

n+ 匹配 包含 至 少 一 个 n 的 任何 字符 串 

n? 匹配 任何 包含 零 个 或 一 个 n 的 字符 串 

n{x) 匹配 包含 x 个 n 的 序列 的 字符 串 

n{x,y} 匹配 包含 x 或 y 个 n 的 序列 的 字符 串 

n{x) 匹配 包含 至 少 x 个 n 的 序列 的 字符 串 

和 匹配 任何 开头 为 n 的 字符 串 。 例 如 : /^You/g, 查 找 所 有 以 Y 开头 的 字符 串 You 

n$ 匹配 任何 结尾 为 n 的 字符 串 

? =n 匹配 任何 其 后 紧 接 指定 字符 串 n 的 字符 串 。 例 如 : /is(? 二 ok)/g, 则 查找 所 有 的 后 面 
是 “ok” 的 字符 串 “is” 

?! n 匹配 任何 其 后 没有 紧 接 指定 字符 串 n 的 字符 串 


2. 创建 RegExp 对 象 


对 于 正则 表达 式 , 可 以 在 有 关 的 字符 串 对 象 中 直接 使 用 ,也 可 以 创建 RegExp 对 象 , 然 
后 在 字符 串 操 作 中 使 用 。 前 者 使 用 直接 量 语 法 ,一般 形 式 为 : 

/pattern/attributes 

如 果 要 创建 RegExp 对 象 , 一 般 形式 为 : 

new RegExp(pattern, attributes); 


其 中 ,参数 pattern 是 一 个 字符 串 ,指定 了 正则 表达 式 的 模式 或 其 他 正则 表达 式 。 参 数 
attributes 是 一 个 可 选 的 字符 串 ,包含 属性 “g"”“i” 和 “m”, 分 别 用 于 指定 全 局 匹配 .区 分 大 
小 写 的 匹配 和 多 行 匹配 ,gi 表示 全 局 并 区 分 大 小 写 的 匹配 。 

例如 : str=str. replace( 八 r/g," 一 br 二 "); 即 为 直接 量 语法 ,将 字符 串 str 中 的 所 有 回 
车 用 二 br> 蔡 换 。 

下 述 代 码 创 建 了 RegExp 对 象 : 


< script type = "text/javascript"> 
function checkemail(str) 
{ 

// 在 JavaScript 中 ,正则 表达 式 只 能 使 用 “/” 开 头 和 结束 ,不 能 使 用 双 引 号 
var Expression=/\w+ ([— +.']\wt)x*x@\w+t([—.]\Wwt)x*\.\wt+([—.]\w+)*/; 
var objExp = new RegExp( Expression); 
if (objExp. test(str) == true) 

return true; 
else 

return false; 
} 
</script > 
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3. RegExp 对 象 的 属性 和 方法 


RegExp 对 象 是 JavaScript 中 提供 的 对 字符 串 进行 匹配 .替换 等 操作 的 对 象 ,和 其 他 对 

象 一 样 ,也 是 由 一 系列 的 属性 和 方法 构成 ,分 别 见 表 5-4。 

表 5-4 RegExp 对 和 象 属性 

属 性 说 明 

返回 正则 表达 式 是 否 具 有 标志 “g”, 查 看 给 定 的 正则 表达 式 是 否 执行 全 局 匹配 。 
如 果 g 标志 被 设置 , 则 该 属性 为 true, 和 否则 为 false 
ignoreCase 返回 是 否 设 置 “i” 标 志 。 如 果 设 置 了 “i” 标志, 则 返回 true, 否 则 返回 false 
返回 正则 表达 式 是 否 具有 标志 “m”。 查 看 给 定 的 正则 表达 式 是 否 以 多 行 模 式 执 
multiline 行 模式 匹配 。 在 这 种 模式 中 ,如 果 要 检索 的 字符 串 中 含有 换行 符 “和 $ 除了 匹 
配 字符 串 的 开头 和 结尾 外 还 匹配 每 行 的 开头 和 结尾 
存放 一 个 整数 ,保存 上 一 次 匹配 文本 之 后 的 第 一 个 字符 的 位 置 。 上 次 匹配 的 结 
果 是 由 方法 RegExp. exec() 和 RegExp. test() 找 到 的 ,它们 都 以 lastIndex 属性 所 
lastIndex 指 的 位 置 作为 下 次 检索 的 起 始点 。 这 样 , 就 可 以 通过 反复 调用 这 两 个 方法 来 遍 
历 一 个 字符 串 中 的 所 有 匹配 文本 。 找 不 到 可 以 匹配 的 文本 时 ,它们 会 自动 把 
lastIndex 属性 重 置 为 0 
返回 模式 匹配 所 用 的 文本 。 该 文本 不 包括 正则 表达 式 直 接 量 使 用 的 定 界 符 ,也 
不 包括 标志 gvi、m 


global 


source 


RegExp 对 象 方法 见 表 5-5。 
表 5-5 RegExp 对 象 方法 


方 ”法 说 明 
方法 test() 用 于 检测 一 个 字符 串 是 否 匹 配 某 个 模式 ,参数 str 为 要 检测 的 字符 
test(str) 串 。 如 果 字 符 串 str 中 含有 与 RegExpObject 匹配 的 文本 , 则 返回 true, 否 则 返 
回 false 


exec() 方法 用 于 检索 字符 串 中 的 正则 表达 式 的 匹配 ,参数 str 为 要 检测 的 字符 
串 。 返 回 一 个 数组 ,其 中 存放 匹配 的 结果 。 如 果 未 找到 匹配 , 则 返回 值 为 null 
compile() 方法 用 于 在 脚本 执行 过 程 中 编译 正则 表达 式 。 参 数 exp 为 正则 表达 
compile(exp,mod) 式 ,mod 规定 匹配 的 类 型 。“g” 用 于 全 局 匹配 ,“i” 用 于 区 分 大 小 写 ,“gi” 用 于 全 
局 区 分 大 小 写 的 匹配 


exec(str) 


例如 ,有 下 面 的 代码 : 


< script type = "text/javascript"> 
var str = "Hello World!"; 

var patt = /lo* /g; 

document. writel( str. match(patt)); 
</script > 


则 输出 结果 为 : 
1,10,1 


例如 : Ad{1,3)\. ){3}\d{1,3) 是 一 个 简单 的 IP 地址 匹配 表达 式 。 其 中 ,\d{1,3} 匹 配 
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一 到 三 位 的 数字 ,(\d(1,3 八 . ){3} 匹 配 三 位 数字 加 上 一 个 英文 句号 ,这 个 整体 被 定义 为 一 
个 分 组 ,然后 分 组 重复 三 次 ,最 后 再 加 上 一 个 一 到 三 位 的 数字 (\d{1,3))。 这 是 一 个 简单 的 
IP 地 址 模式 匹配 ,当然 ,IP 地 址 的 每 一 个 数字 都 是 小 于 255 的 ,可 以 进一步 写 出 更 加 标准 的 
验证 IP 地 址 的 正则 表达 式 。 

在 书写 正则 表达 式 时 ,还 经 常用 [来 指定 一 个 范围 ,例如 : [0-9] 代 表 的 含意 与 \d 完全 
一 致 ,表示 一 位 数字 。[a-z0-9A-Z_] 等 同 于 \w。 例 如 ,对 于 下 述 代码 : 

< script type = "text/javascript"> 

var str= "Hello 你 好 !"; 

var patt = /\w/g; 


document. write( str. match( patt)); 
</script > 


输出 结果 为 : 
He,l,l,o,_ 


可 见 元 字符 “\w” 只 是 匹配 一 个 字母 ,数字 或 ””, 不 能 匹配 汉字 等 其 他 字符 。 

例如 ,正则 表达 式 0\d\d\d\d\d\d\d\d\d\d, 匹 配 这 样 的 字符 串 : 以 0 开头 ,然后 是 两 
个 数字 ,然后 是 一 个 连 字 号 ”-”, 最 后 是 8 个 数字 ( 即 中 国 的 区 号 为 3 位 的 电话 号 码 ) 。 其 中 
“\d" 是 元 字符 ,匹配 一 位 数字 (0,1,2,…)。“-" 不 是 元 字符 ,只 匹配 它 本 身 一 一 连 字 符 或 者 
减 号 。 为 了 避免 重复 ,也 可 以 这 样 写 这 个 正则 表达 式 : 0\d{2)-\d{8)。“\d” 后 面 的 {2}、{8} 
表示 前 面 的 “\d” 必 须 连 续 重复 匹配 的 次 数 为 2 次 (8 次 )。 


4. 常用 正则 表达 式 


正则 表达 式 通 常用 于 表单 中 的 字符 串 处 理 、 表 单数 据 的 有 效 性 验证 等 ,实用 高 效 。 下 面 
是 一 些 常用 的 正则 表达 式 。 

(1) 匹配 中 文字 符 的 正则 表达 式 : [\u4e00-\u9fa5]。 

(2) 匹配 双 字 节 字 符 (包括 汉字 在 内 ): [^x00-\x{ 和 ,可 以 用 来 计算 字符 串 的 长 度 (一 
个 双 字 节 字 符 长 度 计 2,ASCII 字符 计 1)。 

(3) 匹配 空白 行 的 正则 表达 式 : / 八 n\s * \r/, 可 以 用 来 删除 空白 行 。 

(4) 匹配 HTML 标记 的 正则 表达 式 : /二 NSx [二 ]* 记 . *? 过 /1 之 |<. x*? />/。 

(5) 匹配 首尾 空白 字符 的 正则 表达 式 : /As* |\s* $/, 可 以 用 来 删除 行 首 行 尾 的 空白 
字符 (包括 空格 、 制 表 符 、 换 页 符 等 ) ,非常 有 用 的 表达 式 。 

(6) 匹配 E-mail 地 址 的 正则 表达 式 : / 八 w 十 ([- 十 . Nw 十) * @\w 十 ([-. ]\w 十 ) * \.\ 
w 十 ([-. ]\w 十 ) * /, 常 用 于 表单 验证 。 

(7) 匹配 网 址 URL 的 正则 表达 式 : /[a-zA-z] 十 ://[^sj]* /。 

(8) 匹配 账号 是 否 合法 ,以 字母 开头 ,允许 5 一 16B, 人 允许 字母 数字. 下划线, 则 符合 上 
述 要 求 的 正则 表达 式 为 : /^[a-zA-Zj][a-zA-2Z0-9_]{4,15} $ /。 

(9) 匹配 国内 电话 号 码 : 八 d{3}-\d{8}|\d{4)-\d{7}|\d{4)-\d{8)/, 匹 配 形 式 如 010- 
11112222.0531-8836111 或 0531-88361111。 

(10) 匹配 中 国 邮 政 编码 : /[1-9]\d{5}(?! \d)/, 中 国 邮 政 编码 为 6 位 数字 。 
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(11) 匹配 身份 证 : 八 d{15}1\d{18})/, 中 国 的 身份 证 为 15 位 或 18 位 。 
(12) 匹配 IP 地 址 : 作 d 十 \. \d 十 \. \d 十 \. \d 十 / ,提取 IP 地 址 时 有 用 。 
(13) 匹配 腾讯 QQ 号: /[1-9][0-9]{4,}/ ,腾讯 QQ 号 从 10000 开始 。 
(14) 匹配 特定 数字 ,例如 : 


人 [1-9]\dx $/ // 匹 配 正 整数 
/*-[1-9]\dx $/ // 匹 配 负 整数 
/*-?[1-9]\dx* $/ // 匹 配 整 数 

人 [1-9]\dx |0$/ // 匹 配 非 负 整 数 ( 正 整数 或 0) 
/*-[1-9]\dx*10$/ // 匹 配 非 正 整 数 ( 负 整 数 或 0) 


/*[1-9]\dx\.\dx* |0\.\dx [1-9]\dx $/ // 匹 配 正 浮 点 数 
/*-([1-9]\dx\.\dx |0\.\dx [1-9]\dx)$/ // 匹 配 负 浮 点 数 

/*-?([1-9]\dx\.\dx |0\.\dx [1-9]\dx |0?\.0+10)$/ // 匹 配 浮 点 数 
A/*[1-9]\dx\.\dx* |0\.\dx [1-9]\dx |0?\.0+|10$/ // 匹 配 非 负 浮 点 数 ( 正 浮 点 数 + 0) 
/A*(-([1-9]\dx\.\dx |0\.\dx [1-9]\dx))|0?\.0+10$/ // 匹 配 非 正 浮 点 数 ( 负 浮 点 数 + 0) 


(15) 匹配 特定 字符 串 : 
人 [AR-za-z]+S/ // 匹 配 由 26 个 英文 字母 组 成 的 任意 长 度 的 字符 串 


A=2]t 8/ // 匹 配 由 26 个 英文 字母 的 大 写 组 成 的 任意 长 度 的 字符 串 
/*[A-2a-z0-9]+$/ // 匹 配 由 数字 和 26 个 英文 字母 组 成 的 字符 串 
/\w+ $/ // 匹 配 由 数字 、26 个 英文 字母 或 者 下 划 线 组 成 的 任意 长 度 字符 串 


5.5.3 ”Math 对 象 


JavaScript 中 的 Math 对 象 封 装 了 常用 的 数学 常数 和 一 些 常 用 的 数学 运算 ,这 些 运 算 包 


括 三 角 函 数 、 对 数 函 数 、 指 数 函 数 和 一 些 舍 入 函数 等 。 


1. Math 对 象 的 属性 
Math 对 象 中 的 属性 与 其 他 对 象 的 属性 有 一 些 区 别 。 这 些 属性 是 常用 的 数学 常数 , 它 


们 是 定 值 ,因此 它们 是 只 读 的 ,不 允许 对 这 些 对 象 属性 进行 写 操作 。 表 5-6 列 出 了 Math 对 


象 的 属性 名 、 描 述 和 近似 值 。 
表 5-6 Math 对 象 的 属性 
属 性 名 说 明 
E 常数 e, 或 称 做 欧 拉 常数 , 它 是 自然 对 数 的 底 。 近 似 值 是 2. 718 
LN2 2 的 自然 对 数 , 即 以 e 为 底 的 2 的 对 数 ,近似 值 是 0. 693 
LN10 10 的 自然 对 数 ,近似 值 是 2. 302 
LOG2E 以 2 为 底 的 常数 e 的 对 数 ,近似 值 是 1. 442 
LOG10E 以 10 为 底 的 常数 e 的 对 数 , 近 似 值 是 0. 434 
PI 常数 , 即 圆周 长 和 直径 之 比 ,近似 值 是 3. 142 
SQRT1-2 1/2 的 平方 根 ,近似 值 是 0. 707 


SQRT2 2 的 平方 根 ,近似 值 是 1. 414 
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2. Math 对 象 的 成 员 方法 


Math 对 象 的 成 员 函 数 可 分 为 三 角 和 反 三 角 两 类 函数 、 对 数 、 指 数 函 数 、 舍 入 函数 以 及 
随机 函数 等 ,常用 函数 见 表 5-7。 


表 5-7 Math 对 象 的 成 员 方法 


成 员 函 数 说 明 
sin(value) .cos(value), tan(value) 求 value 的 正弦 ,余弦 和 正切 值 ,value 为 弧度 值 
asin(value) 、 acos(value) ,atan(value) 求 value 的 反正 弦 、 反 余弦 和 反正 切 值 ,value 为 弧度 值 
atan2( xvalue, yvalue) 直角 坐标 系 中 (xvalue,yvalue) 点 与 x 轴 所 成 的 角度 
exp(value) 王 的 value 次 方 
log(value) value 的 以 e 为 底 的 自然 对 数 
pow(BaseValue, ExpValue) BaseValue 的 ExpValue 次 方 
sqrt(value) value 的 平方 根 
abs(value) value 的 绝对 值 
ceil(value) 大 于 或 者 等 于 value 的 最 小 整数 值 
floor(value) 小 于 或 者 等 于 value 的 最 大 整数 值 
round(value) value 四 舍 五 人 得 到 的 整数 值 
random() 产生 随机 数 


5.5.4 Date 对 象 


Date( 日 期 ) 对 象 封装 了 有 关 时 间 和 日 期 的 一 些 变 量 和 函数 ,利用 这 些 变量 ,可 以 掌握 当 
前 日 期 和 时 间 。Date 对 象 中 没有 一 个 属性 是 可 以 直接 地 设 定 或 者 取得 的 ,这 种 思想 更 符合 
对 象 的 封装 思想 , 即 成 员 变 量 都 是 私有 的 ,提供 公有 的 成 员 函 数 来 访问 私有 的 成 员 变 量 。 

Date 对 象 的 一 般 格式 是 : 


Date(year, month, day, hours, minutes, seconds) 


1. 创建 日 期 对 象 


创建 日 期 对 象 和 数组 对 象 有 些 相似 ,都 需要 使 用 new 关键 字 , 但 它 的 构造 函数 比较 复 
杂 , 有 多 个 不 同 参 数 的 构造 函数 ,可 以 根据 需要 选择 一 种 格式 来 生成 一 个 新 的 日 期 对 象 , 下 
面 分 别 给 出 它们 的 语法 和 范例 。 

格式 1: var Date0bj = new Date(); 

这 是 最 简单 的 一 种 日 期 对 象 的 创建 格式 。 创 建 该 对 象 时 ,激活 默认 的 构造 函数 ,该 构造 
函数 取 计 算 机 的 当前 时 间作 为 日 期 对 象 的 时 间 值 。 

格式 2: var Dateobj = new Date(" 月 日 ,年 小 时 : 分 : 秒 "); 

在 这 种 格式 中 ,参数 是 一 个 字符 串 ,描述 了 创建 的 Date 对 象 的 各 个 属性 ,该 字符 串 需要 
满足 以 下 情况 。 

(1) 在 月 .日 之 间 的 空格 可 以 省 略 ,但 是 在 年 .时 间 之 间 的 空格 不 可 以 省 略 ,否则 会 使 日 
期 无 效 。 月 份 必 须 用 英语 的 January、February、…、December, 不 能 用 数字 。 


248 Web 技 术 导 半 3 
Ke 技术 导论 (第 3 版 ) 

(2) 日 .年 之 间 的 逗号 不 能 省 略 。 
(3) 时 间 部 分 的 小 时 、 分 . 秒 间 的 冒号 不 可 省 略 。 
(4) 当 “ 日 ”这 一 项 超过 当月 的 天 数 时 ,将 自动 进位 换算 到 下 一 个 月 。“ 小 时 ”这 一 项 超 

过 24 时 也 将 进位 换算 成 日 。 例 如 : 
var meetDate = new Date("June 22,2008 11:50:00"); 
格式 3: var Date0bj = new Date( 年 ,月 ,日 ); 
这 种 格式 中 也 有 几 点 要 说 明 : 
(1) 参数 是 数值 ,不 是 字符 串 ,年 取 后 两 位 。 
(2) 当 “ 月 ”超过 12 或 “日 ”超过 当月 天 数 时 ,将 自动 进位 换算 到 下 一 年 和 月 。 
(3)“ 月 ”参数 取 值 是 从 0 到 11, 即 实际 月 份 比 参数 大 一 。 
(4) 小 时 、 分 、 秒 将 被 认为 是 0。 
格式 4: var Date0bj = new Date( 年 ,月 ,日 ,小 时 ,分 , 秒 ); 
这 种 格式 与 前 一 种 很 相近 ,例如 : 


var Datel = new Date( 96, 2,23,20,55, 00); 


2. Date 对 象 常用 方法 


对 于 Date 对 象 , 不 同 的 浏览 器 支持 不 完全 相同 。 常 用 的 Date 对 象 方法 见 表 5-8。 
表 5-8 Date 对 象 常用 方法 


方 法 名 功 能 
getDate() 从 Date 对 象 返回 一 个 月 中 的 某 一 天 (1 ~ 31) 
getDay() 从 Date 对 象 返回 一 周 中 的 某 一 天 (0 一 6) 
getMonth() 从 Date 对 象 返回 月 份 (0 ~ 11) 
getFullYear() 从 Date 对 象 以 4 位 数字 返回 年 份 
getHours() 返回 Date 对 象 的 小 时 (0 一 23) 
getMinutes() 返回 Date 对 象 的 分 钟 (0 一 59) 
getSeconds() 返回 Date 对 象 的 秒 数 (0 一 59) 
getTime() 返回 1970 年 1 月 1 日 至 今 的 毫秒 数 
setDate() 设置 Date 对 象 中 月 的 某 一 天 (1 ~ 31) 
setMonth() 设置 Date 对 象 中 的 月 份 (0 ~ 11) 
setFullYear() 设置 Date 对 象 中 的 年 份 (4 位 数字 ) 
setHours() 设置 Date 对 象 中 的 小 时 (0 ~ 23) 
setMinutes() 设置 Date 对 象 中 的 分 钟 (0 ~ 59) 
setSeconds() 设置 Date 对 象 中 的 秒 钟 (0 ~ 59) 
setTime() 以 毫秒 设置 Date 对 象 
toString() 把 Date 对 象 转换 为 字符 串 
toTimeString() 把 Date 对 象 的 时 间 部 分 转换 为 字符 串 
toDateString() 把 Date 对 象 的 日 期 部 分 转换 为 字符 串 


除了 上 述 这 些 常 用 的 方法 外 ,Date 对 象 还 包含 许多 关于 世界 时 和 本 地 时 间 的 设置 方 
法 ,在 此 省 略 。 
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【 例 5-4】 编写 程序 ,在 页 面 上 显示 一 个 走动 的 时 钟 ,并 且 当 用 户 关闭 页 面 时 ,显示 页 
面 在 该 页 面 停留 的 时 间 。 

分 析 : 要 获取 页 面 的 停留 时 间 , 对 打开 页 面 和 关闭 页 面 时 间 编 程 即 可 。 

代码 清单 : 


<html> 
<head> 
< script type = "text/javascript"> 
var timeStr, dateStr; 
var begintime = new Date(); 
function timeclock () 
{ 
now= new Date(); 
// 时 间 
hours = now.getHours( ); 
minutes = now. getMinutes(); 
seconds = now. getSeconds(); 
timeStr= "" + hours; 
timeStr += ((minutes <10) ? ":0" : ":") + minutes; 
timeStr += ((seconds <10)? ": : ":") + seconds; 
document. myclock. mytime. value = timeStr; 
// 日 期 
day= now.getDate(); 
month= now.getMonth()+1; 
month= ((month<10)? "0" : "")+ month; 
year = now.getYear(); 


dateStr = "" + month; 
dateStr+= ((day <10) ? "/0" : "/") + day; 
dateStr+= "/" + year; 


document. myclock. mydate. value = dateStr; 
Timer = window. setTimeout ("timeclock()",1000); 
} 
function timeend() 


{ 
endtime new Date( ); 


minutes = (endtime.getMinutes() - begintime. getMinutes()); 


seconds = (endtime. getSeconds() - begintime. getSeconds()); 
time = (seconds + (minutes * 60)); 
alert(" 您 在 本 页 共 停 留 了 ”+ time+" 秒 钟 "); 
} 
</script > 
</head> 
<body onload = "timeclock ()" onUnload= "timeend();"> 
< form name = "myclock"> 
时 间 : < input type= "text" name = "mytime" value= "" size= "10"><br> 
日 期 : < input type = "text" name = "mydate" value= "" size= "10"> 
</form> 
</body> 
</html> 
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WA 


显示 结果 如 图 5-7 所 示 。 


台 c:\Docuaents and Settings\Adainistrator\ 桌 面 \exa5-4... 攻 | 口 | 贺 
文件 @) ”编辑 下 ) 查看 YW 收 丫 刀 ) 工具 XI) 帮助 四 [2 
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地 让 站) | 枸 ] c: \Docanents and Settines\Adninistrator\ 梨 面 \exs5-4.htn 并 园 苇 到 。 沪 流 


10:03:06 | 
: [03/25/2012 


Nicrosoft Internet Explorer ( 医 | 


A 您 在 本 页 共 停留 了 20 秒 名 


CC 要] 


图 5-7 时 钟 显示 示例 


在 上 述 程序 中 ,用 到 了 window 对 象 .document 对 象 和 HTMIL DOM 对 象 , 详 细 介 绍 见 
后 面 的 几 节 。 


5.5.5 ”Array 对 象 


与 其 他 的 高 级 语言 不 同 ,JavaScript 没有 提供 明显 的 数组 类 型 。 数 组 是 一 种 内 置 的 
Array 对 象 , 它 是 一 组 元 素 对 象 的 集合 ,元素 可 以 是 不 同类 型 的 。 数 组 的 每 一 个 成 员 对 象 都 
有 一 个 “下 标 ”, 用 来 表示 它 在 数组 中 的 位 置 (下 标 从 0 开始 ) 。 

1. 一 维 数组 


在 JavaScript 中 ,要 使 用 数组 ,必须 创建 Array 对 象 。 创 建 Array 对 象 ,有 三 种 形式 。 
(1) 定义 了 一 个 空 数组 : 


var < 数组 名 > = new Array(); 


对 于 空 数 组 ,数组 中 元 素 的 个 数 不 确 定 。 接 下 来 可 以 为 数组 添加 元 素 。 


一 般 形 式 是 : 

< 数组 名 >[< 下 标 >] = < 表达 式 >; 

例如 : 

var colorArray = new Array(); // 定 义 一 个 空 数组 


colorArray[0] = "red"; 
colorArray[1] = "green"; 
colorArray[2] = "blue"; 
colorArray[3] = 255; 


(2) 创建 一 个 确定 元 素数 量 的 空 数组 : 
var < 数组 名 > = new Array(size); 


参数 size 是 期 望 的 数组 元 素 个 数 。 返 回 的 数组 ,length 字段 将 被 设 为 size 的 值 。 

(3) 创建 数组 并 初始 化 数组 元 素 。 

用 户 还 可 以 在 定义 数组 的 时 候 直 接 初 始 化 元 素数 据 。 一 般 形式 是 : 

var < 数组 名 > = new Array(< 元 素 1>, < 元 素 2>, < 元 素 3>,…); 

当 使 用 这 些 参数 来 调用 构造 函数 Array() 时 ,新 创建 的 数组 的 元 素 就 会 被 初始 化 为 这 
些 值 。 它 的 length 字段 也 会 被 设置 为 参数 的 个 数 。 

例如 ,var myArray 二 new Array(1, 4.5，"Hi"); 定义 了 一 个 数组 myArray, 里 边 的 
元 素 分 别 是 : myArray[0] 王 = 1; myArray[1] === 4.5; myArray[2] 一 一 "Hi "。 

但 是 ,如 果 元 素 列表 中 只 有 一 个 元 素 ,而 这 个 元 素 又 是 一 个 正 整 数 的 话 ,将 定义 一 个 包 
含 正 整数 个 空 元 素 的 数组 。 例 如 ,var myArray 二 new array(10) ,定义 一 个 长 度 为 10 的 数 
组 ,而 不 是 一 个 数组 ,包含 一 个 正 整 数 元 素 10。 


2. 多 维 数组 


JavaScript 只 有 一 维 数组 ,不 能 和 一 般 的 程序 设计 语言 一 样 ,使 用 类 似 var myArray 一 
new Array(3,4) 的 方法 来 定义 3X4 的 二 维 数组 ,或 者 用 myArray[1,1] 来 访问 “二 维 数组 ” 
中 的 元 素 。 实 际 上 ,所 谓 多 维 数组 ,就 是 数组 的 元 素 本 身 也 是 一 个 数组 。 因 此 ,要 使 用 多 维 
数组 ,在 JavaScript, 可 用 下 面 的 形式 来 定义 : 


Var myArray = new Array(new Array(), new Array(), new Array(), *…); 
例如 。 要 定义 一 个 3X4 的 二 维 数组 ,定义 如 下 : 
var myArray = new Array(new Array(4), new Array(4), new Array(4)); 


然后 ,可 以 用 myArray[i][j] 的 形式 访问 “二 维 数组 ”中 的 元 素 。 

在 JavaScript 中 ,数组 中 的 元 素 可 以 是 不 同类 型 的 ,因此 可 以 定义 oneArray 二 new 
Array(new Array(3), new Array(4)), 它 不 是 一 个 3X4 的 二 维 数组 ,实际 上 oneArray 有 
两 个 元 素 ,第 一 个 元 素 是 一 个 长 度 为 3 的 数组 ,第 二 个 元 素 是 一 个 长 度 为 4 的 数组 。 


3. Array 对 象 的 属性 


Array 对 象 常用 的 属性 是 length 属性 ,保存 数组 的 长 度 , 即 数组 中 元 素 的 个 数 , 它 等 于 
数组 中 最 后 一 个 元 素 的 下 标 加 1。 因 此 , 想 添加 一 个 元 素 ,可 写 做 : myArray[myArray. 
length] 二 …。 对 于 二 维 数组 ,例如 上 面 的 myArray,document. write(myArray. length) 将 
返回 3, 而 不 是 返回 3X4 王 12。 也 就 是 说 myArray 有 三 个 元 素 ,都 是 长 度 为 4 的 数组 。 


4. Array 对 象 的 方法 


对 于 Array 对 象 ,不 同 的 浏览 器 支持 不 完全 相同 。 常 用 的 Array 对 象 方法 见 表 5-9。 
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表 5-9 Array 对 象 常用 方法 


方 法 名 


功 能 


slice(<s>[, <e>)) 


shift() 

pop() 

push() 

unshift(el ,e2，…) 


a. concat(al,a2，…) 


返回 一 个 从 第 s 个 元 素 到 第 个 元 素 的 子 数组 ,如 果 不 给 出 e, 则 返回 的 子 
数组 从 第 s 个 元 素 到 数组 的 最 后 一 个 元 素 

删除 并 返回 数组 的 第 一 个 元 素 

删除 并 返回 数组 的 最 后 一 个 元 素 

向 数组 的 末尾 添加 一 个 或 更 多 元 素 ,并 返回 新 的 长 度 

向 数组 的 开头 添加 一 个 或 更 多 元 素 ,并 返回 新 的 长 度 

将 数组 al ,a2,… 中 的 元 素 添加 到 数组 a 中 


reverse() 颠倒 数组 中 元 素 的 顺序 
sort() 对 数组 的 元 素 进行 排序 
toString() 把 数组 转换 为 字符 串 ,并 返回 结果 
join( 过 分隔 符 二 ) 把 数组 中 的 各 个 元 素 串 起 来 ,用 一 分 隔 符 二 作为 元 素 之 间 的 分 割 符 , 然 后 返 
回 这 个 字符 串 
例如 : 


< script type = "text/javascript"> 
var aa= new Rrray(2) 


aa[0] = "George" 


aa[1] = "John" 

var bb = new Rrray(3) 
bb[0] = "James" 
bb[1] = "Adrew" 
bb[2] = "Martin" 


document. write(aa. concat(bb) ) 


</script > 


在 JavaScript 中 ,可 以 直接 输出 一 个 数组 对 象 , 例 如 document. write(aa) , 则 输出 数组 
中 的 每 一 个 元 素 的 值 ,元 素 值 之 间 用 去 号 分 开 。 


5.5.6 全 局 函数 


除了 内 管 对 象 外 ,还 有 一 些 功 能 是 经 常 需要 使 用 的 ,这 些 功 能 被 定义 为 标准 的 内 管 函 
数 ,不 属于 任何 对 象 ,因此 不 用 再 通过 引用 对 象 的 方式 来 使 用 它们 , 称 为 JavaScript 全 局 函 
数 。 常 用 的 全 局 函数 见 表 5-10。 


表 5-10 JavaSeript 全 局 函数 


函 数 名 


说 有 明 


parselInt(str, radix) 


解析 一 个 字符 串 ,并 返回 一 个 整数 。 参 数 为 str 要 被 解析 的 字符 串 ,参数 radix 
表示 要 解析 的 数字 的 基数 , 介 于 2 一 36 之 间 


parseFloat(str) 


可 解析 一 个 字符 串 ,并 返回 一 个 浮 点 数 。 只 有 字符 串 中 的 第 一 个 数字 会 被 返 
回 。 如 果 字 符 串 的 第 一 个 字符 不 能 被 转换 为 数字 ,那么 parseFloat() 会 返 
回 NaN 


eval(string) 


计算 JavaScript 字符 串 ,并 把 它 作为 脚本 代码 来 执行 ,如 果 有 计算 结果 的 话 ， 
则 返回 计算 的 结果 


续 表 
函 数 名 说 明 
把 对 象 的 值 转换 为 数字 。 如 果 参 数 是 Date 对 象 ,Number() 返回 从 1970 年 1 
Number(object) 月 1 日 至 今 的 毫秒 数 。 如 果 对 象 的 值 无 法 转换 为 数字 ,那么 Number() 函数 


返回 NaN 


String(object) 


把 对 象 的 值 转换 为 字符 串 。 参 数 object 为 JavaScript 对 象 


isNaN(x) 


检查 是 否 非 数字 值 。 如 果 x 是 特殊 的 非 数 字 值 NaN( 或 者 能 被 转换 为 这 样 的 
值 ) ,返回 的 值 就 是 true; 如 果 x 是 其 他 值 , 则 返回 false 


isFinite(number) 


用 于 检查 其 参数 是 否 无 穷 大 。 如 果 number 是 有 限 数字 (或 可 转换 为 有 限 数 
字 ) ,那么 返回 true; 否则 ,如 果 number 是 NaN( 非 数字 ) ,或 者 是 正 ` 负 无 穷 大 
的 数 , 则 返回 false 


把 字符 串 作为 URI 进行 编码 ,返回 URIstring 的 副本 ,其 中 的 某 些 字符 将 被 十 


encodeURICURIstr) 六 进 制 的 转 义 序列 替换 。 如 果 URI 组 件 中 含有 分 隔 符 , 比 如 ? 和 # , 则 应 当 
使 用 encodeURIComponent() 方法 分 别 对 各 组 件 进 行 编码 

decodeURICURIstring) 对 encodeURI() 函数 编码 过 的 URI 进行 解码 。 返 回 值 为 URIstring 的 副本 ， 
其 中 的 十 六 进 制 转 义 序列 将 被 它们 表示 的 字符 替换 

encodeURIComponent | 把 字符 串 作为 URI 组 件 进行 编码 。 参 数 URIstr 含有 URI 组 件 或 其 他 要 编 

(URIstr) 码 的 文本 

donde KICOmponent 对 encodeURIComponent() 函数 编码 的 URI 进行 解码 

(URIstr) 


【 例 5-5】 JavaScript 字符 串 函 数 eval 〇 常常 用 于 动态 地 得 到 变量 名 的 操作 ,阅读 下 列 


代码 ,分 析 运 行 结果 。 


< script type = "text/javascript"> 


Var Scorel = 97; 
Var Score2 = 100; 
for (i=0;i<2;i++) 


{ 


valstr = "score" + (i+1); // 构 造 变 量 名 


document. write("valstr= "+eval(valstr) + "<br>"); 


} 


</script > 


上 述 代码 中 ,声明 了 两 个 整数 变量 ,用 循环 输出 它们 的 值 ,在 循环 中 构造 变量 名 ,通过 也 
数 eval(str) 计 算 字符 串 ctr 作为 一 个 JavaScript 表达 式 所 对 应 的 值 。 


6.6 浏览 器 对 象 


每 一 个 符合 ECMAScript 规范 的 脚本 程序 设计 语言 都 包含 三 个 部 分 , 即 ECMAScript 
规范 .浏览 器 对 象 模型 (Browser Object Model,BOM) 和 文档 对 象 模型 (Document Object 
Model, DOM) 。 所 谓 浏 览 器 对 象 模型 (BOM) ,就 是 指 当 用 户 打开 浏览 器 时 ,浏览 器 中 的 
JavaScript Runtime Engine 将 在 内 存 中 自动 创建 一 组 对 象 , 用 于 对 浏览 器 及 HTML 文档 对 
象 模型 中 数据 的 访问 和 操作 。 因 为 这 些 对 象 是 和 浏览 器 本 身 紧密 相关 的 , 称 为 浏览 器 对 象 。 
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5.6.1 浏览 器 对 象 模型 


当 使 用 浏览 器 打开 一 个 网 页 时 ,浏览 器 就 在 内 存 中 创建 了 一 个 window 对 象 , 它 封 装 了 
浏览 器 的 整个 窗口 ,如 果 文 档 中 包含 框架 (frame 或 iframe 标签 ) ,浏览 器 还 会 为 每 个 框架 创 
建 一 个 额外 的 window 对 象 。 在 window 对 象 的 封装 中 ,包含 窗口 标题 工具 按钮 .地 址 栏 、 
客户 区 、 状 态 栏 等 ,这 些 窗 口 的 组 成 部 分 ,也 被 定义 为 浏览 器 对 象 , 它 们 都 是 window 的 成 员 
对 象 ,因此 ,构成 一 种 层次 结构 ,这 就 是 浏览 器 对 象 模型 。 

JavaScript 定义 的 浏览 器 对 象 的 层次 结构 如 图 5-8 所 示 。 

window 对 象 
| 
oa doa i i ed 


图 5-8 浏览 器 对 象 模 型 层次 结构 


在 JavaScript 中 ,浏览 器 对 象 模型 (BOM) 的 6 个 对 象 中 , window 对 象 是 最 顶层 的 对 
象 , 它 对 应 浏览 器 窗口 本 身 , 其 他 5 个 对 象 均 是 window 对 象 的 成 员 对 象 , 其 中 document 成 
员 对 象 也 是 HTML 文档 对 象 模型 (DOM) 中 的 重要 对 象 。 

浏览 器 对 象 模 型 中 的 每 一 个 对 象 其 实 是 一 种 预 声明 的 内 存 对 象 ,用 户 可 以 直接 使 用 。 
需要 注意 的 是 ,这 些 对 象 的 名 字 的 第 一 个 字母 都 是 小 写 的 ,写成 大 写 就 会 出 现 JavaScript 运 
行 错误 。 


5.6.2 window 对 象 


window 对 象 表 示 一 个 浏览 器 窗口 或 一 个 框架 。 在 客户 端 JavaScript 中 , window 对 象 
是 全 局 对 象 ,所 有 的 表达 式 都 在 当前 的 环境 中 计算 。 也 就 是 说 ,要 引用 当前 窗口 不 需要 指定 
窗口 对 象 本 身 ,可 以 把 window 对 象 的 属性 作为 全 局 变量 来 使 用 。 例 如 ,可 以 将 window. 
document 简写 为 document, window. alert() 可 以 简写 为 alert()。 这 是 对 窗口 对 象 的 隐 式 
应 用 ,如 果 要 显示 地 表明 窗口 ,可 写 为 window. [属性 | 方法 ] 或 self. [属性 | 方法 ]。 对 窗口 
中 二 frame 二 的 引用 见 下 面 的 windows 属性 介绍 。 


1. window 对 象 的 常用 属性 


window 对 象 的 属性 可 分 为 一 般 属性 和 对 象 属性 .每 一 个 属性 具有 不 同 的 读 写 权 限 , 即 
有 的 属性 为 只 读 属性 ,不 能 为 属性 进行 赋值 ,有 的 属性 则 可 以 进行 读 写 操作 。window 对 象 
的 一 般 属性 及 成 员 对 象 见 表 5-11。 
表 5-11 window 对 象 属性 表 


属 性 名 说 明 
如 果 window 中 包含 帧 , 则 frames 为 一 个 数组 对 象 ,保存 每 个 帧 对 应 的 子 窗口 。 可 以 
通过 window. frames["frame-name"] 或 数组 下 标 0 一 n 来 访问 


frames 


属 性 名 


说 明 


opener 


返回 对 创建 此 窗口 的 窗口 的 引用 


name 


设置 或 返回 存放 窗口 的 名 称 的 一 个 字符 串 。 窗 口 的 名 称 可 以 用 做 一 个 二 a 或 者 
<<form> 标记 的 target 属性 的 值 


window self 


window 和 self 均 为 对 当前 窗口 的 引用 ,相当 于 this 


top 返回 顶级 窗口 的 只 读 引用 
返回 一 个 布尔 值 ,该 值 声明 了 窗口 是 否 已 经 关闭 。 该 属性 为 只 读 。 当 浏览 器 窗口 关 

closed 闭 时 ,表示 该 窗口 的 window 对 象 不 会 消失 , 它 将 继续 存在 ,不 过 它 的 closed 属性 将 
被 设置 为 true 

a location 对 象 是 window 对 象 的 一 部 分 ,包含 有 关 当 前 URL 的 信息 。 可 通过 
window. location 属性 来 访问 

history history 对 象 是 window 对 象 的 一 部 分 ,包含 用 户 在 当前 浏览 器 窗口 中 访问 过 的 URL 
每 个 载 人 浏览 器 的 HTML 文档 都 会 成 为 document 对 象 ,document 对 象 是 window 

document 对 象 的 一 部 分 ,document 对 象 使 我 们 可 以 从 脚本 中 对 HTML 页 面 中 的 所 有 元 素 进 
行 访问 

defaultStatus 设置 或 返回 窗口 状态 栏 中 的 默认 文本 ,该 属性 可 读 可 写 

Status 设置 或 返回 窗口 状态 栏 中 的 文本 

navigator navigator 对 象 包 含有 关 浏 览 器 的 信息 

Screen 包含 有 关 客 户 端 显示 屏幕 的 信息 


【 例 5-6】 编写 一 个 网 页 文件 1. htm ,确保 不 被 嵌入 到 一 个 框架 中 打开 。 
分 析 : 利用 window 对 象 的 self 和 top 属性 可 以 判断 窗口 是 否 在 一 个 框架 中 ,如 果 是 ， 


则 跳出 框架 。 


代码 清单 : 


<html> 

<head> 

<meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"> 

</head> 

<body> 

< script type = "text/javascript"> 

if (window. top! = window. self){ 
window. top. location= "1. htm" 

} 

</script > 

</body> 

</html > 


【 例 5-7】 有 一 个 Web 应 用 主 界面 采用 帧 来 实现 一 个 1024 宽度 的 页 面 ,并 居中 显示 ， 


在 1024 区 域 ,又 分 成 200X10X * 三 列 ,分 别 对 应 菜单 .控制 条 和 内 容 区 。 


代码 清单 : myframes. htm 


< htm]l xmlns = "http://www. w3.org/1999/xhtml"> 

<head> 

</head> 

< frameset cols ="* /1024, * " framespacing= "0" frameborder = "0" id = "mainframes"> 
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< frame name = "free-left" scrolling= "no" noresize src="#"> 
< frameset rows = "75,20, * " framespacing = "0" frameborder = "0" id = "frames01"> 
< frame name = "topframe" scrolling = "no" noresize src = "mybanner. html"> 
< frame name= "ctrltop" scrolling= "no" noresize src= "scrolltop. html"> 
< frameset cols= "200,10, *" id= "frames02"> 
< frame name = "leftframe" scrolling = "auto" noresize src= "menu. htm"> 
<frame name= "ctrlleft" scrolling = "no" noresize src = "scrollleft. html"> 
< frame name = "mainFrame" scrolling = "auto" noresize src = "introduction. htm"> 
</frameset > 
</frameset > 
< frame name = "free-right" scrolling= "no" noresize src="#"> 


</frameset > 
</html > 


要 求 完 成 控制 条 代码 scrollleft. html, 使 得 单 击 控制 条 时 ,实现 左 侧 帧 的 折 钱 和 打开 。 

分 析 : 这 是 一 个 多 层 赃 套 的 window, 需 要 注意 的 是 ,对 于 一 frame 之 和 一 frameset 二 ,不 
管 它们 处 于 哪个 层次 ,都 是 顶层 窗口 window. top 的 成 员 对 象 ,对 象 之 间 没 有 层次 关系 ,这 
一 点 就 如 在 二 table 字 中 使 用 一 a> 建 立 超 链 接 , 对 二 a> 对 象 的 访问 不 需要 通过 过 table 二 对 
象 一 样 。 

代码 清单 : scrolltop. html 


< htm] > 

<head> 

< script language = "JavaScript"> 
var tt=1; 

function ctrl] top() 


{ 


) 


if (tt==1) 

{ 
window. parent. frames01. rows = "0,20, * "; 
toparrow. src = "toctrltop01. gif"; 
tt=0; 

} 

else 

{ 
Window. parent. frames01. rows = "75,20, * "; 
toparrow. src = "toctrltop02. gif"; 
tt=1; 


</script > 

</head> 

<body style = "margin:0px" onClick= "ctrl top()"> 
<table width= "100%" border = "0" cellspacing = "0"> 
<tr> 


<td align = "right"> 单 击 可 显示 或 隐藏 页 首 < img id = "toparrow" src = "toctrlleft02. gif" 


align = "absmiddle"></td> 
</tr> 

</table> 

</body> 


</htm]l > 
代码 清单 : scrollleft. html 


< html > 
<head> 
<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312"> 
< script type = "text/JavaScript"> 
Var tt=1; 
function ctrl left() 
{ 
if (tt==1) 
{ 
window. parent. frames02. cols = "0,10, * "; 
lrarrow. src = "toctrlleft01. gif"; 
tt=0; 
} 
else 
window. parent. frames02. cols = "200,10, * "; 
lrarrow. src = "toctrlleft02. gif"; 
tt=1; 
} 
} 
</script > 
</head> 
<body style = "margin:0px;background - color: #c0ddeb;cursor:hand" onClick = "ctrl] left()"> 
<table height = "100%" border = "0" cellspacing = "0"> 
<tr> 
<td align = "center">< img id = "lrarrow" src= "toctrlleft02.gif"></td> 
</tr> 
</table> 
</body> 
</html > 


上 述 代码 清单 的 关键 是 访问 二 frameset 二 对 象 , 在 JavaScript 运行 时 引擎 为 HTML 标 
记 创建 DOM 对 象 时 ,它们 都 是 window 对 象 的 直接 成 员 , 直 接 通过 window 对 象 或 标记 的 
id 属性 即 可 访问 。 如 果 是 要 访问 一 个 具体 的 一 frame 二 ,可 以 使 用 window. frames[ "frame- 
name'"] 或 window. frame-name 来 完成 ,其 中 frame-name 是 要 访问 的 二 frame 二 的 name 属 
性 值 。 

例如 : 


window. parent. frames["frame 一 b"]. document. bgColor = color; 


可 以 在 一 个 帧 窗口 frame-a 中 设置 另 一 个 帧 窗口 frame-b 的 背景 颜色 为 color 值 。 
2. window 对 象 的 常用 方法 
window 对 象 的 常用 方法 见 表 5-12。 
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表 5-12 window 对 象 常用 方法 


说 明 


open() 


打开 一 个 新 的 浏览 器 窗口 或 查找 一 个 已 命名 的 窗口 ,并 返回 该 窗口 对 象 
的 句柄 。 包 含 四 个 可 选 参数 

URL, 新 窗口 中 要 显示 的 文档 的 URL, 取 值 为 空 时 ,新 窗口 不 显示 任何 
文档 

Name, 新 窗口 的 名 称 , 可 以 用 做 标记 一 a> 和 二 form 的 属性 target 的 
值 。 如 果 该 参数 指定 了 一 个 已 经 存在 的 窗口 ,那么 open() 方法 就 不 再 创 
建 一 个 新 窗口 ,而 返回 对 指定 窗口 的 引用 

Features ,设置 窗口 特征 

Replace, 当 取 值 为 true 时 ,URL 替换 浏览 历史 中 的 当前 条 目 ; 当 取 值 为 
false 时 ,URL 在 浏览 历史 中 创建 新 的 条 目 


close() 


关闭 浏览 器 窗口 ,只 有 通过 JavaScript 代码 打开 的 窗口 才能 够 由 
JavaScript 代码 关闭 。 这 阻止 了 恶意 的 脚本 终止 用 户 的 浏览 器 


focus() 


把 键盘 焦点 给 予 一 个 窗口 


blurO 


把 键盘 焦点 从 顶层 浏览 器 窗口 移 走 ,整个 窗口 由 window 对 象 指定 。 哪 
个 窗口 最 终 获得 键盘 焦点 并 没有 指定 


moveTo(x,y) 


把 窗口 的 左上 角 移 动 到 一 个 指定 的 坐标 (x,y) 处 


moveBy(x,y) 


相对 窗口 的 当前 坐标 把 它 在 xy 方向 移动 指定 的 像素 


resizeTo( width, height) 


将 窗口 的 宽度 和 高 度 调整 为 width 和 height 个 像素 


resizeBy(width, height) 


将 窗口 的 宽度 和 高 度 增 大 或 减少 width 和 height 个 像素 


scrollTo(xpos,ypos) 


把 内 容 滚动 到 指定 的 坐标 处 。 参 数 xpos/ypos 表示 要 在 窗口 文档 显示 区 
左上 角 显 示 的 文档 的 x/y 坐标 


scroll(xnum, ynum) 


scrollBy(xnum, ynum) 


将 文档 分 别 向 右 、 向 下 滚动 xnum 和 ynum 像素 


setInterval() 


按 指定 周期 (毫秒 ) 调 用 函数 或 计算 表达 式 。 有 两 个 参数 。 
code, 必 选 参数 ,要 调用 的 函数 或 要 执行 的 代码 串 
millisec, 周 期 性 执行 或 调用 code 函数 的 时 间 间 隔 ,以 毫秒 计 


setTimeout() 


在 指定 的 毫秒 数 后 调用 函数 或 计算 表达 式 。 参 数 同 setInterval ( )， 
setTimeout() 只 执行 code 一 次 。 如 果 要 多 次 调用 ,使 用 setInterval() 或 
者 让 code 自身 再 次 调用 setTimeout() 


clearInterval(id) 


取消 由 setInterval() 设置 的 timeout。 参 数 id 必须 是 由 setInterval() 返 
回 的 ID 值 


clearTimeout(id) 


可 取消 由 setTimeout() 方法 设置 的 timeout 


alert(message) 


显示 带 有 一 条 指定 消息 和 一 个 OK 按钮 的 警告 框 


confirm(message) 


显示 一 个 带 有 指定 消息 和 OK 及 “取消 ”按钮 的 对 话 框 。 如 果 用 户 单 击 
“确定 ”按钮 , 则 confirm() 返回 true。 如 果 单 击 “ 取 消 ” 按 钮 , 则 confirm() 
返回 false 


print() 


打印 当前 窗口 的 内 容 。 类 似 用 户 单 击 浏览 器 中 的 “打印 ”按钮 


对 于 setInterval() 和 setTimeout() 两 种 方法 ,前 者 定义 周期 性 执行 的 函数 更 加 方便 ,不 
需要 递归 调用 接口 实现 。 例 如 ,下 列 脚本 程序 可 以 在 页 面 中 显示 一 个 走动 的 时 钟 : 


< script type = "text/javascript"> 
var clockid = self. setInterval("clock()",1000); 


第 5 章 “客户 端 编程 


function clock() 

var nowtime = new Date( ); 

form1. clock. value = nowtime. toTimeString(). substring(0,8); 
} 


</script> 
当 打 开 一 个 窗口 时 ,可 设置 的 窗口 特征 见 表 5-13。 
表 5-13 窗口 特征 
特 征 说 有 明 
top \left 窗口 左上 角 坐 标的 像素 值 
height width 窗口 的 高 度 和 宽度 
titlebar 是 否 显示 标题 栏 , 取 值 为 yxeslnol110。 默 认 是 yes 
menubar 是 否 显示 菜单 栏 , 取 值 为 yxeslnol110。 默 认 是 yes 
toolbar 是 否 显示 浏览 器 的 工具 栏 , 取 值 为 yeslnol110。 默 认 是 yes 
location 是 否 显示 地 址 字段 , 取 值 为 yes|no|1|10。 默 认 是 yes 
Status 是 否 添加 状态 栏 , 取 值 为 yes|no|110。 默 认 是 yes 
scrollbars 是 否 显示 滚动 条 , 取 值 为 yxeslnol110。 默 认 是 yes 
resizable 窗口 是 否 可 调节 尺寸 , 取 值 为 yes|nol110。 默 认 是 yes 
channelmode 是 否 使 用 剧院 模式 显示 窗口 , 取 值 为 yes|nol110。 默 认 是 no 
fullscreen 是 否 使 用 全 屏 模式 显示 浏览 器 。 默 认 是 no。 处 于 全 屏 模 式 的 窗口 必须 同时 处 
于 剧院 模式 
directories 是 否 使 用 剧院 模式 显示 窗口 , 取 值 为 yxes|no|110。 默 认 是 no 


【 例 5-8】 当 在 浏览 器 中 打开 一 个 页 面 时 ,如 果 文 档 长 度 大 于 浏览 器 窗口 的 高 度 , 则 出 
现 垂直 滚动 条 。 要 求 : 编写 代码 ,使 得 窗口 滚动 条 置 于 窗口 的 底部 。 

分 析 : 这 是 在 实际 项 目 研发 中 常用 的 功能 , 它 可 能 是 单 击 上 部 一 个 按钮 ,在 文档 尾部 添 
加 了 一 条 记录 ,应 该 自动 地 定位 到 文档 底部 。 

代码 清单 : 


<html> 
<head> 
<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312"> 
<style> 
body{ 
margin:0px;padding:0px; 
overflow— x:hidden; 
overflow— y:hidden; 
} 
#myfixeddiv{ 
position:absolute; 
top: 10; 
left:10; 
width:100%; 
background — color: # ff£0000; 
border:1px solid #00ff00; 
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z— index: — 1; 
} 
div# scrollcontent{ 
width:100%; 
height:100%; 
overflow:auto; 
padding: 0px 30px 30px 30px; 
上 
</style> 
< script type = text/javascript> 
function gobottom( ) 
{ 
alert("scroll to bottom"); 
// 滚 动 窗口 滚动 条 到 页 面 底部 , 本 处 未 用 到 
var c = Window. document. body. scrollHeight; 
window. scrollBy(0, c); 
// 将 div 的 滚动 条 移动 到 底部 
var divobj = document. getElementById('scrollcontent'); 
divobj. scrollTop = divobj. scrollHeight; 
} 
</script > 
</head> 
<body style = "overflow— x:hidden; "> 
<div id= "myfixeddiv"> 
< input type = "button” value = "滚动 条 置 底 " name = "bl" onclick = "gobottom();"> 
</div> 


<div id= "scrollcontent"> 
< script type = "text/javascript"> 
for (i=1;i<50;i++) 
window. document. write("Line" + i+"<br>"); 
</script > 
<a href ="#" onclick = "window. scrollTo(0, 0); document. getElementById( 'scrollcontent ' ) . 
scrollTop = 0;"> 回 顶部 </a> 
</div> 
</body> 
</html > 


在 浏览 器 中 打开 上 述 页 面 ,显示 结果 如 图 5-9 所 示 。 

在 上 述 代码 中 ,有 三 个 在 实际 项 目 研 发 中 遇 到 的 重要 的 技术 难点 ,解释 如 下 。 

(1) 滚动 条 置 底 。 通 常情 况 下 ,滚动 条 会 出 现在 窗口 和 div 中 ,在 窗口 中 ,可 以 比较 容 
易 地 控制 滚动 条 的 位 置 , 即 通过 gobottom() 函 数 中 的 window. scrollBy(0,c) 即 可 实现 。 将 
图 层 中 的 滚动 条 定位 到 图 层 的 底部 ,方法 不 同 , 见 gobottom() 函 数 。 

(2) 将 图 层 固定 ,不随 滚动 条 的 滚动 而 滚动 . 且 不 闪烁 。 在 正常 的 页 面 中 ,图 层 会 随 着 
滚动 条 的 滚动 而 滚动 ,有 些 广告 页 面 中 ,会 看 到 广告 窗口 图 层 虽 然 定 位 在 一 个 位 置 ,但 滚动 
条 滚动 时 ,图 层 会 闪烁 ,影响 效果 。 代 码 是 将 二 body 之 分 成 了 两 个 图 层 , 一 个 输出 固定 不 动 
的 内 容 , 另 一 个 输出 其 他 内 容 。 
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同时 ,设置 <body> 样 式 , 将 二 body 之 的 滚动 条 隐藏 ; 设置 一 div 二 样式 ,显示 滚动 条 ， 
且 图 层 宽度 为 100% ,高 度 为 100%% , 则 输出 内 容 使 得 过 div 之 出 现 滚 动 条 时 ,看 上 去 类 似 窗 
口 滚动 条 ,移动 ,不 影响 另外 的 二 div 之 ,即使 得 图 层 固定 不 动 , 且 不 会 闪烁 。 

(3) 将 固定 图 层 的 z-index 设置 为 -1, 使 得 在 有 多 个 图 层 和 三 加 时 , 它 在 底部 。 


5.6.3 


忆 了 :\ 教 材 --Yeb 技 术 导论 (第 3 版 )\ 滚 动 条 置 底 一 1. htn ~ Wieresse@I26 跨国 [=EE3 
文件 @) 编辑 @) 查看 WW 收 总 和 ) 工具 上 帮助 0 EE 


回报 -日 "回国 多 | 人 P 扫 过 六 中 二 天 如 | 全 -总 回 - 
郝 址 部 外 ] E: \ 教 材 --Web 技 术 导 论 第 3 版 )\ 滚 动 条 置 底 --1. htn 7| 国 匠 到 | 证 按 


图 5-9 滚动 条 置 底 操作 页 面 


location 对 象 


location 对 象 是 window 对 象 的 成 员 对 象 ,封装 了 浏览 器 窗口 的 地 址 栏 。location 对 象 
包含 的 属性 见 表 5-14。 


属 性 名 


表 5-14 location 对 象 常用 属性 
说 明 


href 


可 读 写 属性 ,设置 或 返回 完整 的 URL。 可 以 通过 为 该 属性 设置 新 的 URL, 使 浏览 器 
读 取 并 显示 新 的 URL 的 内 容 


protocol 


可 读 写 属性 ,可 设置 或 返回 当前 URL 的 协议 ,包括 后 面 的 冒号 (:) 


hostname 


可 读 写 属性 ,存储 URL 地 址 中 的 主机 名 十 域名 部 分 ,不 包括 端口 号 


host 


可 读 写 属性 ,存储 URL 的 主机 名 和 端口 号 ,只 有 端口 号 是 URL 的 一 个 明确 部 分 时 ， 
值 中 才 包 括 端口 号 


port 


可 读 写 属性 ,设置 或 返回 当前 URL 的 端口 部 分 


pathname 


可 读 写 属性 ,存储 URL 中 文件 路 径 。 如 果 URL 中 的 网 页 文件 是 根 下 的 一 个 文件 , 则 
location. pathname 的 值 为 根 (/) 


hash 


可 读 可 写 属性 ,该 字符 串 是 URL 的 锚 部 分 (从 # 号 开始 的 部 分 ) 


search 


可 读 可 写 属性 ,设置 或 返回 当前 URL 中 的 问号 (“?”) 之 后 的 部 分 , 即 页 面 的 参数 
部 分 
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location 对 象 的 方法 见 表 5-15。 
表 5-15 location 对 象 常用 方法 


方法 说 明 
把 一 个 新 的 URL 赋 给 当前 窗口 的 location 对 象 , 即 在 当前 窗口 打开 一 个 新 的 页 
assign(URL) 面 。 也 可 以 通过 为 location. href 赋值 来 导航 到 一 个 新 的 网 页 。 采 用 assign 的 方 
法 会 使 代码 易 维 护 


如 果 没 有 参数 ,或 者 参数 是 false, 用 HTTP 头 If-Modified-Since 检测 服务 器 上 
的 文档 是 否 已 改变 。 如 果 文 档 已 改变 ,reload() 会 再 次 下 载 该 文档 。 如 果 文档 
未 改变 , 则 该 方法 将 从 缓存 中 装载 文档 。 这 与 用 户 单 击 浏览 器 中 的 “刷新 ”按钮 
reload([true|false]) | 的 效果 是 完全 一 样 的 

如 果 该 方法 的 参数 设 为 true, 无 论文 档 的 最 后 修改 日 期 是 什么 , 它 都 会 绕 过 组 
存 , 从 服务 器 上 重新 下 载 该 文档 。 这 与 用 户 在 单 击 浏览 器 中 的 “刷新 ”按钮 时 按 
住 Shift 键 的 效果 是 完全 一 样 

用 一 个 新 文档 取代 当前 文档 。 不 会 在 history 对 象 中 生成 一 个 新 的 记录 。 当 使 
用 该 方法 时 ,新 的 URL 将 覆盖 history 对 象 中 的 当前 记录 


replace(newURL) 


我 们 在 介绍 document 对 象 时 曾 提 及 一 个 location 属性 ,我 们 要 将 这 两 个 同名 者 区 分 
开 。 只 需要 记 住 location 对 象 是 可 读 可 写 的 ,就 是 说 ,可 以 对 location 对 象 的 属性 赋值 ; 而 
document 对 象 的 location 属性 是 一 个 只 读 属性 , 它 只 是 提供 文档 的 URL, 改 变 它 也 是 没有 
意义 的 。 因 为 ,document 的 location 属性 描述 了 文档 的 URL, 改 变 它 就 是 表示 这 个 文档 被 
复制 到 另外 的 URL, 这 是 不 可 能 发 生 的 。 

例如 : 下 面 的 代码 定义 一 个 超 链 接 , 单 击 , 则 在 当前 窗口 打开 一 个 新 的 网 页 。 


<a href ="#" onclick = "window. location. assign( 'http://www. google. com')"> Google 搜索 </a> 


【 例 5-9】 利用 location 对 象 ,在 htm 页 面 中 ,编写 一 个 函数 获取 并 输出 传人 的 参数 名 
及 参数 值 。 

分 析 : 在 HTML 中 , 当 打开 一 个 网 页 时 ,经 常会 传人 相应 的 参数 ,如 果 调 用 的 是 服务 器 
页 面 (如 JSP 页 面 ), 则 服务 器 页 面 可 以 通过 服务 器 端的 request. getParameter("id") ;程序 
来 获取 页 面 中 的 参数 ,这 和 表单 数据 的 获取 相同 。 如 果 调 用 的 是 htm 文档 , 则 需要 通过 客 
户 端的 location 对 象 来 获取 ,并 且 需 要 使 用 类 。 

假设 有 两 个 页 面 1. htm 和 2. htm, 在 1. htm 中 ,定义 了 一 个 超 链 接 : 


<a href = "2. htm?username = janeSage= 18" target = "blank"> test parameter </a> 


要 在 客户 端 实现 上 述 功能 ,需要 在 2. htm 中 定义 一 个 求 传人 参数 的 类 ,来 解析 URL 中 
的 参数 表 , 然 后 将 解析 后 的 参数 名 称 和 参数 值 , 在 当前 页 面 创 建 为 内 存 变量 。 
代码 清单 : 


<head> 

<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312"> 
< script type = "text/javascript"> 

function GetParaString( ) 

{ 


Var name, value, i= 0; 
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var str = window. location. href; // 取 浏览 器 地 址 栏 URL 串 
var num = str. indexOf("?") 
str = str. substr(num + 1); // 截 取 *?” 后 面 的 参数 串 
var arrtmp = str. split("g&"); // 将 各 参数 分 离 形成 参数 数组 
for (i=0;i<arrtmp. length;i++) 
{ 
num = arrtmp[i]. indexOf(" = "); 
if (num>0) { 
name = arrtmp[ i]. substring(0, num); // 取 得 参数 名 称 
value = arrtmp[ i]. substr(num+ 1); // 取 得 参数 值 
this[name] = value; // 定 义 对 象 属性 并 初始 化 
于 
} 
} 
function showDatal( obj) 
{ 
for(var prop in obj) 
document. write(prop+ ":" + obj[prop]+ "<br>"); 
} 
</script > 
</head> 
<body> 
<p> 传 人 参数 为 : </p> 
< script type = "text/javascript"> 
var Request = new GetParaString( ); // 创 建 参数 对 象 实例 
var myname = Request["username"]; // 取 参数 username 
var myage = Request["age"]; // 取 参数 age 
myage = parseInt(myage,10); // 将 年 龄 字符 串 转化 为 整数 


showData( Request); 
</script > 
</body> 
</html > 
上 述 代 码 完 成 后 ,进行 测试 : 在 1. htm 中 , 单 击 超 链接 test parameter, 则 打开 一 个 新 窗 
口 ,显示 2. htm, 在 页 面 的 顶部 ,显示 传人 的 参数 名 和 参数 值 。 


5.6.4 history 对 象 


history 对 象 是 window 对 象 的 成 员 对 象 , 它 保存 了 当前 窗口 或 框架 在 某 时 间 段 内 曾经 
打开 网 页 的 URL 列表 。 使 用 history 对 象 只 能 在 这 些 列表 之 间 跳 转 ,不 能 得 到 具体 的 URL 
串 。 出 于 安全 方面 的 原因 ,history 对 象 并 不 向 脚本 提供 列表 的 URL 串 ,也 就 是 说 无 法 通过 
history 对 象 来 得 到 用 户 曾经 访问 的 URL 的 具体 值 。 这 是 为 了 防止 恶意 的 脚本 程序 获得 用 
户 个 人 的 浏览 习惯 而 进行 不 正当 的 网 络 传输 或 散播 ,这 些 信息 是 大 部 分 用 户 不 愿意 泄露 的 。 

对 于 history 对 象 ,只 有 一 个 属性 , 即 length, 它 是 只 读 属 性 ,返回 当前 窗口 历史 清单 的 
长 度 。history 对 象 方法 见 表 5-16。 
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表 5-16 history 对 象 的 方法 


施 .“ 法 描 述 
back() 装载 历史 清单 中 的 前 一 个 URL, 相 当 于 工具 栏 中 的 “后 退 ” 按 钮 
forward() 装载 历史 清单 中 的 后 一 个 URL, 相 当 于 工具 栏 中 的 “前 进 ” 按 钮 
go(x) 参数 既 可 以 是 整数 ,也 可 以 是 字符 串 。 当 参数 是 整数 x 时 ,装载 历史 清单 中 当前 位 置 偏 


移 x 后 的 URL。 当 参数 是 字符 串 时 ,装载 历史 清单 中 含有 这 个 字符 串 的 最 近 URL 


如 果 我 们 的 网 页 有 很 多 内 容 ,那么 靠 浏览 器 提供 的 “后 退 ” 按 钮 返回 前 一 个 URL 较 慢 ， 
可 以 在 网 页 中 设置 “快速 返回 "按钮 。 代 码 如 下 : 


< input type = "button" value = "快速 返回 " onClick = "history. go(-5)"> 

在 每 页 中 的 适当 位 置 设置 这 个 按钮 ,每 单 击 一 次 将 向 后 5 个 URL ,结合 浏览 器 中 的 “后 
退 " 按 钮 ,将 可 以 快速 地 向 后 翻动 。 

5.6.5 screen 对 象 


screen 对 象 是 window 对 象 的 成 员 对 象 , 它 封 装 了 用 户 计算 机 显示 屏幕 的 信息 。 
JavaScript 程序 可 以 利用 这 些 信 息 来 优化 输出 ,以 达到 用 户 的 显示 要 求 。screen 对 象 常用 
属性 见 表 5-17。 


表 5-17 screen 对 象 属性 


属 性 描 述 
availHeight availWidth 存储 浏览 器 屏幕 可 用 的 高 度 和 宽度 的 像素 数 
height width 存储 浏览 器 屏幕 的 高 度 和 宽度 的 像素 数 


除了 上 述 属 性 外 ,screen 对 象 还 有 一 组 与 分 辨 率 、 色 彩 有 关 的 属性 ,在 此 省 略 。 此 外 ,和 
其 他 对 象 不 同 ,screen 对 象 没有 提供 方法 。 

由 于 现在 的 大 多 数 浏览 器 采用 了 标签 式 页 面 管理 ,不 再 是 IE 6.0 那样 ,打开 一 个 网 页 ， 
就 打开 一 个 浏览 器 窗口 ,它们 都 体现 在 Windows 操作 系统 的 任务 栏 中 。 现 在 ,这 些 页 面 窗 
口 都 被 组 织 在 浏览 器 窗口 中 ,这 使 得 页 面 的 切换 和 关闭 变 得 容易 。 

在 标签 式 页 面 组 织 模式 下 ,如 果 在 一 个 窗口 通过 window. open() 方 法 动态 地 打开 一 个 
窗口 ,不 管 如 何 设置 新 建 窗口 的 属性 ,或 者 移动 新 窗口 的 位 置 ,以 及 对 窗口 进行 放大 、 缩 小 等 
操作 ,将 都 不 生效 ,而 是 和 其 他 窗口 一 样 作为 一 个 页 面 标签 ,出 现在 浏览 器 窗口 中 。 


5.6.6 _ navigator 对 象 


在 BOM 中 ,navigator 对 象 是 window 对 象 的 成 员 对 象 , 它 封装 了 有 关 操 作 系 统 、 浏 览 
器 版 本 等 环境 信息 。navigator 对 象 最 早 是 Netscape 提出 的 ,但 其 他 实现 了 JavaScript 的 浏 
览 器 同样 支持 这 个 对 象 。 

navigator 对 象 常用 属性 及 方法 见 表 5-18。 


第 5 章 “客户 端 编程 


表 5-18 ” navigator 对 象 属性 及 方法 
属 性 


pligiasti plug-in 对 象 的 数组 ,其 中 的 元 素 代表 浏览 器 已 经 安装 的 插件 。plug-in 对 象 提供 
的 是 有 关 插 件 的 信息 ,其 中 包括 它 所 支持 的 MIME 类 型 的 列表 
appName 存储 表示 浏览 器 名 称 的 字符 串 
存储 客户 所 用 浏览 器 的 版 本 号 和 操作 系统 等 信息 ,不 同 的 浏览 器 显示 的 内 容 项 
appVersion 
目 不 同 
appMinorVersion 浏览 器 的 次 级 版 本 
appCodeName 浏览 器 代码 名 称 
platform 返回 运行 浏览 器 的 操作 系统 平台 
方 法 
. 该 方法 可 返回 一 个 布尔 值 ,该 值 指 示 浏览 器 是 否 支 持 并 启用 了 Java。 如 果 是 , 则 
ee 返回 true, 否 则 返回 false 


G2 HTML 文档 对 象 


当 浏 览 器 打开 一 个 网 页 时 ,不 管 是 HTML 还 是 XML 文档 ,对 于 网 页 中 的 每 一 个 标记 ， 
都 在 内 存 中 创建 一 个 相应 的 内 存 对 象 。 这 些 对 象 按 照 树 形 结构 组 织 , 这 就 是 文档 对 象 模型 
(DOM)。 可 以 将 DOM 理解 为 网 页 的 API, 它 将 网 页 中 的 元 素 看 做 一 个 个 对 象 ,这 些 对 象 
通过 标记 的 name 属性 来 命名 ,通过 对 这 些 可 访问 的 内 存 对 象 进行 编程 ,来 实现 对 网 页 中 元 
素 及 其 属性 的 修改 ,以便 动态 地 修改 网 页 。 


5.7.1 文档 对 和 象 模型 


根据 W3C DOM 规范 ,文档 对 象 模型 (DOM) 是 一 种 与 系统 平台 、 浏 览 器 ,语言 无 关 的 
接口 。DOM 解决 了 Netscape 的 JavaScript 和 Microsoft 的 JScript 之 间 的 冲突 ,为 Web 应 
用 开发 提供 了 一 个 标准 的 方法 ,从 而 使 应 用 程序 和 浏览 器 脚本 能 动态 地 访问 和 更 新 文档 的 
内 容 。 

W3C DOM 被 分 为 三 个 不 同 的 部 分 , 即 核心 DOM、XML DOM 和 HTML DOM。 核 心 
DOM 是 用 于 任何 结构 化 文档 的 标准 模型 ,XML DOM 和 HTML DOM 分 别 是 用 于 XML 
文档 和 HTML 文档 的 标准 模型 。 在 DOM 中 ,定义 了 所 有 文档 元 素 的 对 象 和 属性 ,以 及 访 
问 它们 的 方法 。 

对 于 DOM 对 象 的 访问 ,可 以 出 现在 页 面 的 脚本 程序 中 ,也 可 以 直接 在 浏览 器 地 址 栏 中 
书写 。 例 如 , 当 浏览 网 页 时 ,有 时 候 需 要 知道 网 页 的 发 布 时 间 , 从 而 判断 网 页 内 容 是 否 很 久 
以 前 的 ,此 时 ,可 以 在 浏览 器 的 地 址 栏 中 输入 : 


javascript :document. write(document. lastModified) 


输入 结束 后 , 按 Enter 键 , 则 打开 一 个 新 的 网 页 显示 当前 正在 浏览 的 网 页 的 最 后 修改 日 
期 。 然 后 单 击 浏览 器 工具 栏 中 的 “后 退 " 按 钮 ,返回 到 刚才 浏览 的 网 页 。 
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1. HTML DOM 对 象 


在 HTML 文档 中 , 当 浏 览 器 打开 一 个 网 页 时 ,JavaScript 运行 时 引擎 将 为 每 一 个 标记 
在 内 存 中 建立 一 个 内 存 对 象 , 即 HTML DOM 对 象 。 根据 HTML 的 层次 结构 ,这 些 
HTML DOM 对 象 也 表现 为 一 种 层次 关系 ,形成 HTML DOM 树 。 

根据 HTML DOM 的 概念 ,每 一 个 DOM 对 象 都 对 应 一 个 HTML 标记 ,因此 ,常用 的 
HTML DOM 对 象 见 表 5-19。 


表 5-19 常用 HTML DOM 对 象 


DOM 对 象 说 明 
document 表示 整个 HTML 文档 ,可 用 来 访问 页 面 中 的 所 有 元 素 
meta 对 应 一 个 二 meta 元 素 
Link 对 应 一 个 一 link 二 > 元素 
style 对 应 一 个 单独 的 样式 声明 
base 对 应 二 base 二 元 素 
body 对 应 二 body 二 元 素 
Image 对 应 二 img 二 元 素 
Anchor 对 应 二 a 二 元 素 
Table 对 应 二 table 二 元 素 
TableRow 对 应 二 tr 二 元 素 
TableData 对 应 二 td 二 元 素 
area 对 应 图 像 地 图 中 的 一 area> 元 素 
frameset 对 应 二 frameset 二 元素 
frame 对 应 二 frame 二 元素 
iframe 对 应 二 iframe 二 元素 
form 对 应 二 form 二 元素 
button 对 应 王 button 过 元素 
input radio 对 应 表单 中 的 一 个 单 选 按钮 
input text 对 应 表单 中 的 一 个 文本 框 
input password 对 应 表单 中 的 一 个 密码 域 
textarea 对 应 二 textarea 二 元 素 
input checkbox 对 应 表单 中 的 一 个 复 选 框 
select 对 应 表单 中 的 一 个 选择 列表 
option 对 应 一 option 过 元素 
input file 对 应 表单 中 的 一 个 文件 上 传 
input hidden 对 应 表单 中 的 一 个 隐藏 域 
input submit 对 应 表单 中 的 一 个 “确认 ?按钮 
input reset 对 应 表单 中 的 一 个 “ 重 置 "按钮 
object 对 应 二 object 志 元素 
Event 代表 某 个 事件 的 状态 


在 表 5-19 中 ,在 DOM 对 象 列 ,有 的 是 可 以 使 用 的 对 象 .例如 document、body 对 象 , 因 
为 一 个 HTML 文档 只 有 一 个 document 和 一 个 body 对 象 ; 有 的 是 对 象 类 ,例如 Image, 因 
为 一 个 HTML 文档 可 能 包含 多 个 二 img 二 标记 ,每 个 标记 都 创建 一 个 Image 对 象 。 所 有 的 
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HTML DOM 对 象 之 间 为 层次 结构 关系 ,这 种 关系 和 HTML 规范 中 标记 之 间 的 层次 关系 
一 致 。 因 此 ,可 以 说 document 对 象 是 所 有 其 他 DOM 对 象 的 父 对 象 , 其 他 对 象 都 是 通过 
document 对 象 访问 的 。HTML DOM 对 象 层次 结构 关系 如 图 5-10 所 示 。 


window 


bs 


过 1 
1 1 


document 


| 
| 1 


anchors images forms links frames body 


text password textarea radio checkbox button select hidden submit/reset 


图 5-10 HTML DOM 对 象 层次 结构 


2. DOM 对 象 属性 及 方法 


记 住 每 一 个 HTML DOM 对 象 的 属性 和 方法 是 非常 困难 的 。 但 是 只 要 理解 了 HTML 
标记 和 HTML DOM 对 象 之 间 的 关系 , 则 DOM 对 象 的 学 习 将 变 得 轻松 。 因 为 ,在 HTML 
DOM 中 ,每 一 个 对 象 对 应 一 个 HTML 标记 ,HTML 标记 的 属性 则 对 应 着 HTML DOM 对 
象 的 属性 和 方法 。HTML 标记 的 一 般 属性 对 应 HTML DOM 对 象 的 属性 ,HTML 标记 的 
事件 属性 对 应 DOM 对 象 的 方法 。 可 见 , 当 我 们 熟悉 了 HTML 标记 的 属性 后 , HTML 
DOM 对 象 就 很 容易 理解 了 。 

例如 : 对 应 一 img src 一 "smile. jpg" style 一 "position :absolute; bottom:0px" 二 ,将 创 
建 一 个 image 对 象 ,该 对 象 必然 有 一 个 src 属性 和 style 属性 , 且 src 属性 的 值 为 smile. jpg， 
style 属性 将 图 片 定位 在 窗口 的 底部 。 通 过 修改 image 对 象 的 属性 值 ,从 而 对 过 img 之 标记 
的 图 片 进行 操作 。 


5.7.2 document 对象 


在 HTML DOM 中 ,document 对 象 代表 整个 HTML 文档 ,可 用 来 访问 页 面 中 的 所 有 
元 素 , 包 括 文档 头 二 head 盖 部 分 和 文档 体 一 body 二 部 分 。 此 外 ,需要 注意 的 是 document 对 
象 是 浏览 器 对 象 模型 (BOM) 中 的 window 对 象 的 一 个 成 员 对 象 , 可 通过 window. document 
属性 来 访问 。 


1. document 对 象 属性 


在 HTML DOM 中 ,document 对 象 封装 了 整个 HTML 文档 ,因此 文档 的 每 一 个 部 分 
都 可 以 通过 document 对 象 来 访问 ,文档 中 所 有 内 容 也 被 封装 成 了 document 对 象 的 属性 。 
HTML 文档 是 由 文本 、 图 片 . 超 链接 、 表 格 、 表 单 . 图 层 、span\ 嵌 入 对 象 . 脚 本 程序 等 构成 的 ， 
它们 构成 了 document 对 象 的 属性 。document 对 象 属性 名 见 表 5-20。 

document 对 象 包含 的 属性 很 多 ,在 FrontPage 中 的 代码 视图 ,输入 window. document， 
可 打开 IntelliSense 窗口 ,显示 其 包含 的 全 部 属性 和 方法 。 
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表 5-20 ”document 对 象 常用 属性 


属 性 名 说 明 

all[] 提供 对 文档 中 所 有 HTML 元 素 的 访问 

images[] 提供 对 文档 中 所 有 Image 对 象 的 引用 

anchors[] 返回 对 文档 中 所 有 Anchor 对 象 的 引用 ,每 一 个 anchor, 对 应 一 个 超 链接 标记 二 a 
name 一 "bookname" 二 ,如果 含有 href 属性 , 则 对 象 同时 也 保存 到 links[] 数 组 中 

links[] 返回 对 文档 中 所 有 Link 对 象 和 二 a href 二 "url" 二 超 链接 的 引用 

forms[] 返回 对 文档 中 所 有 Form 对 象 的 引用 

body 提供 对 二 body 元 素 的 直接 访问 。 对 于 定义 了 框架 集 的 文档 ,该 属性 引用 最 外 
层 的 一 frameset> 

title 返回 当前 文档 的 标题 

lastModified 返回 文档 被 最 后 修改 的 日 期 和 时 间 

cookie 设置 或 返回 与 当前 文档 有 关 的 所 有 cookie 

domain 返回 当前 文档 的 域名 

URL 返回 当前 文档 的 URL 


referrer 


返回 载 入 当前 文档 的 URL 


2. document 对 象 方法 


document 对 象 的 方法 见 表 5-21。 


方 ” 法 


表 5-21 document 对 象 常用 方法 
描 述 


open(mimetype, replace) 


打开 一 个 输出 流 , 返 回 一 个 新 的 document 对 象 , 该 对 象 可 以 接收 来 自 write() 
或 writeln() 方 法 的 输出 

参数 mimetype, 可 选 ,规定 正在 写 的 文档 的 类 型 ,默认 值 是 text/html 

参数 replace, 新 文档 将 覆盖 当前 的 网 页 内 容 


write(expl ,exp2,…) 


向 文档 写 HTML 表达 式 或 JavaScript 代码 ,如 果 是 一 个 逻辑 表达 式 , 则 输 
出 true 或 false, 如 果 是 一 个 Array 对 象 , 在 输出 数组 元 素 的 值 , 多 个 元 素 值 
之 间 用 逗号 分 开 


writeln(expl,exp2,…) 


等 同 于 write() 方 法 ,输出 结束 后 输出 一 个 换行 符 


close() 


关闭 用 document. open() 方 法 打开 的 输出 流 , 并 显示 选 定 的 数据 


getElementById(id) 


返回 对 拥有 指定 id 的 第 一 个 对 象 的 引用 


getElementsByName 


返回 带 有 指定 名 称 的 对 象 集合 。 另 外 ,因为 一 个 文档 中 的 name 属性 可 能 
不 唯一 (如 HTML 表单 中 的 单 选 按 钮 通常 具有 相同 的 name 属性 ), 所 以 


和 
liad getElementsByName() 方法 返回 的 是 元 素 的 数组 ,而 不 是 一 个 元 素 
El ByTagN: 
gnu ”| 返回 带 有 指定 标签 名 的 对 象 集合 ,返回 元 素 的 顺序 是 它们 在 文档 中 的 顺序 


HTML DOM 定义 了 多 种 查找 元 素 的 方法 ,除了 getElementById() 之 外 ,还 有 
getElementsByName() 和 getElementsByTagName() 。 

不 过 ,如 果 需 要 查找 文档 中 的 一 个 特定 的 元 素 ,最 有 效 的 方法 是 getElementById() 。 
在 操作 文档 的 一 个 特定 的 元 素 时 ,最 好 给 该 元 素 一 个 id 属性 ,为 它 指定 一 个 (在 文档 中 ) 唯 
一 的 名 称 , 然 后 就 可 以 用 该 ID 查找 想 要 的 元 素 。 可 以 用 getElementsByTagName() 方法 
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获取 任何 类 型 的 HTML 元 素 的 列表 。 例 如 ,下 面 的 代码 可 获取 文档 中 所 有 的 表 : 


var tables = document. getElementsByTagName("table"); 
alert ("This document contains " + tables. length + " tables"); 


3. 访问 HTML DOM 对 象 方法 
利用 文档 对 象 document, 可 以 用 多 种 方法 获得 一 个 HTML 标记 对 应 的 DOM 对 象 , 主 


要 有 以 下 几 种 方法 。 


1) 利用 标记 的 id 属性 访问 对 象 
在 同一 个 HTML 文档 中 ,标记 的 id 属性 应 该 是 唯一 的 ,因此 可 以 通过 id 来 访问 对 应 


的 内 存 DOM 对 象 。 有 两 种 方法 。 


方法 1: 获取 id 对 应 的 DOM 对 象 。 

var obj = document. getElementById("element — id"); 

方法 2: 直接 使 用 id 标识 。 

element - id. [属性 | 方法 ] = … 

如 果 有 一 个 标识 元 素 id 的 字符 串 ,使 用 eval() 函数, 可 以 得 到 对 应 的 DOM 对 象 , 即 ; 
Obj = eval( "element — id") 


这 种 转化 在 编程 时 也 很 重要 。 
2) 利用 标记 的 name 属性 访问 对 象 
JavaScript 运行 时 引擎 在 创建 DOM 对 象 时 ,标记 的 name 属性 即 成 为 DOM 对 象 的 名 


。 通 过 name 属性 访问 对 应 的 内 存 对 象 ,有 两 种 方法 。 


方法 1: 获取 name 对 应 的 DOM 对象。 
var obj = document. getElementsBYName("element-name") ; 


因为 一 个 HTML 中 ,元 素 的 names 属性 可 以 重 名 ,因此 返回 的 可 能 是 一 个 数组 。 
方法 2: 直接 使 用 元 素 的 name 值 。 
对 于 在 二 form 二 中 设计 的 输入 域 ,通常 会 给 定 一 个 name 属性 ,此 时 可 以 使 用 下 列 形式 


访问 表单 中 的 这 些 输入 域 对 象 : 


obj = document. form - name. element — name 
也 可 以 使 用 
obj = document.all. element - name 或 obj = document.all("element - name") 


对 于 二 form 二 外 的 元 素 标记 ,不 能 通过 元 素 的 name 属性 直接 访问 对 象 。 例 如 : 对 于 一 


个 二 span name 王 "spl" 二 二 /span 二 , 则 下 列 两 种 用 法 都 是 错误 的 。 


document. sp1. innerText = "xxx", 
document. all. spl. innerText = "xxx" 


要 使 用 上 述 写 法 , 需 将 所 span 二 的 name 属性 设置 改 为 id 属性 设置 , 即 二 span id 一 
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"spl"->. 

3) 利用 document 的 all 成 员 对 象 访问 

所 有 的 DOM 对 象 ,都 保存 在 document 的 all、images、links、anchors 和 forms 数组 成 
员 中 ,利用 这 几 个 成 员 可 以 访问 DOM 对 象 。 数 组 元 素 的 访问 可 以 利用 对 象 id、 对 象 名 或 元 
素 下 标 0…n 进行 。 

使 用 all 成 员 对 象 访问 DOM 对 象 有 多 种 形式 : 

obj = document,.all.element 一 id 

obj = document.all["element 一 id"] 

obj = document.all("element 一 id") 

obj = document. all. item("element 一 id") 

需要 注意 的 是 ,必须 使 用 元 素 的 id 属性 ,不 能 使 用 name 属性 ,因为 在 一 个 HTML 文档 
中 ,name 属性 是 可 以 重 名 的 , 重 名 时 ,JavaScript 会 创建 一 个 数组 ,而 id 属性 是 不 能 重 名 的 ， 
它 唯 一 地 标识 了 一 个 元 素 。 

【 例 5-10】 正确 访问 HTML DOM 对 象 是 进行 JavaScript 编程 的 基础 ,阅读 下 列 代 
码 ,分 析 运 行 结果 。 

代码 清单 : accessdoms. htm 


< htm] > 
<head> 
<meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"> 
< style type= "text/css"> 
span{font-size:13px; color: # 0000FF; cursor:hand} 
</style> 
< script type = "text/javascript"> 
function imgmove( strid) 
{ 
obj = document. getElementById( strid) 
obj. style. bottom = 100; 
eval( strid). style. bottom = 100; 
} 


function winclose(obj) 
{ 

document. form1. btnclose. value = obj. innerHTML; 
} 


function divdisplay( strid) 

{ 
obj = document. all[ strid]; 
obj. style. left = (document. body. clientWidth-100)/2; 
obj. style. top = (document. body. clientHeight-75)/2; 
if (document. all. item( strid). style. display == "none") 

document.all. item( strid). style. display = "block"; 

else 


[ 


document.all. item( strid). style. display = "none"; 


</script> 

</head> 

<body> 

< span onclick = "imgmove( 'dogimg') "> 访问 image 对 象 </span>| |< span onclick = "winclose(this)"> 
访问 对 象 与 参数 传递 </span>| |< span onclick = "divdisplay( 'popupdiv')"> 显 示 或 隐藏 图 层 </span> 
< img src = "mydog. jpg" id = "dogimg" style = "position:absolute;bottom:0;left:0"> 

<div id= "popupdiv" style = "position:absolute; top:50; left:50;width:100;height:75;border: 
1px solid #ff0000;padding:10px; text-align:center;display:none"> 

图 层 在 客户 区 居中 

</div> 

< form name = "forml"> 

< input type = "text" name = "btnclose" value = ""> 

</form> 

</body> 

</html > 


对 于 上 述 代码 清单 ,说 明 如 下 。 

(1) 对 图 片 对 象 .图 层 和 表单 对 象 , 分 别 使 用 了 不 同 的 方法 进行 访问 和 操作 。 但 都 是 为 
了 获取 这 个 DOM 对 象 。 

(2) 对 于 JavaScript 函数 定义 和 调用 ,形式 参数 可 以 是 字符 串 , 也 可 以 是 一 个 对 象 ,两 
者 在 函数 内 部 使 用 时 不 同 。 比 如 : imgmove(strid) 函数 的 定义 ,在 实际 函数 调用 时 ,参数 使 用 
的 是 字符 串 , 因 此 在 函数 内 部 ,通过 eval() ,将 参数 字符 串 转 化 成 对 应 的 对 象 。 函 数 winclose 
(obj) 在 调用 时 ,参数 为 this, 即 当前 对 象 ,因此 函数 内 部 直接 使 用 参数 名 ,而 不 能 转换 。 

在 定义 JavaScript 函数 时 ,如 果 某 个 参数 为 标记 的 id, 在 函数 调用 时 ,如 果实 际 参数 只 
写 id 号 , 则 参数 代表 的 是 一 个 对 象 ,如 果 参 数 写成 id 号 两 侧 用 双 引 号 或 单 引 号 括 起 来 ,参数 
则 是 字符 串 , 两 者 有 着 很 大 的 不 同 , 直 接 影响 函数 内 部 的 语句 写法 。 

(3) 我 们 使 用 二 span 二 模拟 了 一 个 超 链 接 , 这 也 是 二 span 二 非常 灵活 的 地 方 ,特别 是 可 
以 对 二 span 二 任意 地 定义 样式 。 

网 页 accessdoms. htm 在 浏览 器 中 的 显示 结果 如 图 5-11 所 示 。 
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对 于 document 对 象 ,在 执行 输出 操作 后 ,最 后 一 定 要 使 用 close() 方 法 关闭 输出 流 , 否 
则 ,在 浏览 器 的 状态 栏 将 显示 蓝 色 进度 条 ,显示 下 载 未 完成 。 例 如 ,在 一 个 数据 记录 内 容 修 
改 页 面 ,向 一 个 iframe(name 二 filelistbox) 中 输出 内 容 , 代 码 如 下 : 


document. filelistbox. document. write("< body style = 'margin-top: 0px; margin-left: 10px; font- 
size:12px; line-height:150 % >"); 
document. filelistbox. document. write("< span style = 'display:none;'>" + iframestr + "</span 


>"); 


document. filelistbox. document. write("."); 


document. filelistbox. document. write("</body >"); 
document. filelistbox. document. close( ); 


5.7.3 body 对 象 


每 一 个 HTML 文档 有 一 个 二 body 之 标记 ,浏览 器 在 内 存 中 创建 一 个 body 对 象 ,body 
对 象 封装 了 HTML 文档 中 过 body 之 标记 的 所 有 属性 及 所 有 的 文档 体 元 素 。 从 HTML 结 
构 看 ,body 对 象 是 document 对 象 的 成 员 对 象 。body 对 象 的 常用 属性 见 表 5-22。 


表 5-22 ” document. body 对 象 属性 


属 性 说 明 
id 设置 或 返回 body 的 id 
className 设置 或 返回 body 之 元 素 的 class 属性 
dir 设置 body> 元 素 的 文本 方向 , 取 值 为 rt 


topMarign bottomMargin 
leftMarign .rightMargin 
clientLeft、 clientTop 
clientWidth .clientHeight 
innerHTML 


innerText 
bgColor 
disabled 


存储 浏览 器 窗口 客户 区 内 容 和 上 、 下 \ 左 \ 右 边框 的 距离 (像素 ) 


存储 浏览 器 窗口 客户 区 左上 和 角 (x*y) 坐 标 

存储 浏览 器 窗口 客户 区 宽度 和 高 度 

innerHTML 可 以 赋值 一 段 符合 HTML 规范 的 文本 ,该 文本 将 重 写 现 有 
网 页 的 二 body 二 体内 的 内 容 

为 innerText 赋值 ,页面 将 用 innerText 的 内 容重 写 二 body 二 体内 的 内 容 
设置 或 返回 二 body 二 元 素 的 背景 色 属性 

如 果 该 成 员 变 量 设 为 true, 则 页 面 的 内 容 被 灰 化 , 且 不 可 被 选取 , 右 击 时 
快捷 菜单 被 禁用 


body 对 象 的 innerHTML 和 innerText 的 属性 功能 不 同 , 如 果 一 段 字 符 串 文本 包含 
HTML 标记 ,将 该 文本 赋 给 innerText, 则 页 面 内 容 用 innerText 的 文本 替换 ,该 文本 不 按 
照 其 包含 的 HTML 标记 显示 ; 如 果 同 样 的 文本 赋 给 innerHTML 属性 , 则 页 面 内 容 被 
innerHTML 中 的 文本 替换 ,该 文本 按照 HTML 规范 解析 。 例 如 : document. body. innerText 
一 "<b> Hello 一 /b>" 和 document body. innerHTML 王 "<b> Hello 王 /b>", 产 生 的 结果 


不 同 。 


从 HTML 文档 结构 看 ,body 对 象 是 document 对 象 的 成 员 对 象 , 对 文档 体内 所 有 元 素 
的 访问 应 该 通过 document. body 来 进行 。 但 是 .为 了 书写 上 的 方便 ,在 document 对 象 中 ， 
直接 包含 了 有 关 文 档 体 内 的 元 素 对 象 。 例 如 : 设置 文档 的 背景 色 , 理论 上 应 该 写 为 
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document. body. bgColor 王 "" ,但 是 ,也 可 以 直接 写 为 document. bgColor 王 "" ,两 种 写法 结 
果 是 一 样 的 。 实 际 上 ,对 文档 体 中 大 多 数 元 素 的 访问 几乎 都 可 以 直接 使 用 document, 而 不 
是 document. body。 


5.7.4 image 对 象 


在 HTML 文档 中 ,每 个 二 img 之 标记 都 创建 一 个 image 对 象 , 这 些 对 象 保存 在 
document 对 象 的 images 数组 成 员 中 。 因 为 二 img 二 标记 的 属性 很 多 ,这 也 就 决定 了 image 
对 象 的 属性 。image 对 象 的 属性 见 表 5-23 。 


表 5-23 image 对 象 属性 


居 性 说 明 
id 设置 或 返回 图 像 的 id 
name 设置 或 返回 图 像 的 名 称 
src image 对 象 对 应 图 片 的 URL 
height width 图 片 的 高 度 和 宽度 
vspace 图 片 在 垂直 方向 上 与 上 面 或 下 面 文字 之 间 的 距离 
border 图 片 周围 边框 的 宽度 ,默认 值 为 0 
align 可 设置 返回 与 内 联 内 容 的 对 齐 方式 
className 设置 或 返回 元 素 的 class 属性 
title 设置 或 返回 元 素 的 提示 性 标题 


在 网 页 中 使 用 图 片 ,除了 增加 页 面 的 视觉 效果 ,还 可 以 通过 JavaScript 程序 动态 地 选择 
载 人 的 图 片 , 或 者 实现 一 些 动画 效果 ,从 而 增加 页 面 的 动感 。 

【 例 5-11】 有 两 幅 小 狗 左右 张望 的 图 片 ,利用 image 对 象 ,实现 简单 的 动画 效果 。 

分 析 : 只 要 利用 window 对 象 的 setInterval() 函数 ,两 幅 图 像 轮 流 显 示 即 可 。 

代码 清单 : imgloop. htm 


< htm] > 

<head> 

< script type = "text/javascript"> 

var num= 1; 

var imgslist = new Array(2); 

for (i=0;i<2;i++) 

{ 
imgslist[i] = new Image( ); 
imgslist[i].src= "dog" + (i+1)+".jpg' 

} 

var clockid = self. setInterval("imgloop()",1000); 


function imgloop() 
{ 
myimg. src = imgslist[num-1]. src; 
num++; 
if (num>2) num= 1; 
forml. msg. value = num; 


} 
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</script> 
</head> 
<body> 
< img id= "myimg" src= "dogl. jpg"> 
< form name = "forml1"> 
< input type = "text" name= "msg" size= "15" /> 
< input type = "button" value = "Stop" onclick = "window. clearInterval(clockid)"> 
</form> 
</body> 
</html > 


说 明 ,在 创建 image 对象 时 ,使 用 new Image() ,其 中 的 Image 首 字母 是 大 写 , 这 点 特别 
要 注意 ,因为 JavaScript 中 的 许多 内 置 对 象 的 首 字母 都 是 小 写 的 ,但 作为 类 型 使 用 时 ,大 都 
是 首 字母 大 写 ,例如 数组 Array 对 象 \ 日 期 Date 对 象 等 ,新 建 对 象 时 应 使 用 首 字母 大 写 。 

另外 ,和 Image 对 象 有 关 的 事件 包括 两 个 。Q@DonAbort 事件 , 当 用 户 放 弃 载 入 一 个 图 像 
时 触发 一 个 abort 事件 ,于 是 会 执行 onAbort 事件 处 理 函 数 的 JavaScript 代码 。 例 如 , 当 在 
载 入 的 过 程 中 单 击 一 个 链接 或 是 单 击 了 浏览 器 中 的 “停止 ”按钮 时 , 就 是 这 种 情况 。 
@OnError 事件 , 当 浏 览 器 完成 载 和 一 幅 图 像 时 触发 一 个 load 事件 。 注 意 ,是 完成 载 入 后 ， 
而 不 是 载 入 开始 时 。 


5.7.5 Link 对 象 与 Anchor 对 象 


在 HTML 文档 中 ,有 两 种 类 型 的 链接 ,一 种 是 在 过 head 之 … 所 /head> 之 间 的 过 link 盖 
元 素 , 还 有 就 是 超 链接 标记 二 a 之 。 对 于 过 a 二 标记 ,一 种 形式 用 于 定义 一 个 超 链 接 , 即 设置 
href 属性 ,还 有 一 种 形式 就 是 定义 文档 中 的 锚 点 , 即 只 有 name 属性 ,没有 href 属性 。 

根据 上 述 情况 ,document 有 两 个 成 员 对 象 数组 , 即 anchors[] 和 links[] ,anchors[] 保 存 
Anchor 对 象 ,links[] 保 存 Link 对 象 和 超 链接 对 象 。 不 论 是 Link 对 象 还 是 Anchor 对 象 ， 
对 象 的 属性 总 是 与 二 link 二 标记 和 二 a 二 标记 的 属性 相对 应 。 

【 例 5-12】 设置 和 更 改 二 a 二 标记 的 相关 属性 。 

分 析 : 对 于 超 链 接 , 使 用 HTML DOM 对 象 ,可 以 更 改 超 链接 的 目标 文件 。 

代码 清单 : links. htm 


<html> 
<body> 
<form> 
< input type = "button" value = "Googlen 
‘onClick = "document. links[0]. href = 'http://www. google. com'"> 
< input type = "button" value = "百度 " 
‘onClick = "document. links[0]. href = 'http://www. baidu. com'"> 
< input type = "button" value = "北大 天 网 " 
onClick = "document. links[0]. href = 'http://www. pku. edu. cn'"> 
</form> 
<a href = "javascript:alert(' 选 择 搜索 引擎 ,然后 单 击 下 一 步 ')"> 下 一 步 </a> 
<script> 
document. write(document. anchors. length); 
document. write(document. links. length) 
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</script> 

</body> 

</html > 

在 浏览 器 中 打开 上 述 页 面 ,可 以 看 到 输出 的 anchors 数组 长 度 为 0,links 数组 的 长 度 为 1。 
说 明 document. anchors 数组 存储 的 只 是 具有 name 属性 的 二 a 二 标记 ,如 果 二 a 二 标记 具有 
href 属性 , 则 对 象 同 时 被 保存 到 document 对 象 的 anchors 和 links 数组 中 。 

二 a href 二 "javascript:alert(' 请 按 按钮 选择 下 一 步 的 目的 地 1”)" 二 下 一 步 二 /a 二 是 网 页 
中 定义 的 一 个 超 链接 ,存储 在 document. linksL0]. href 中 。 

在 二 a 二 标记 中 ,href 属性 中 应 该 是 一 个 URL, 但 是 在 这 个 句子 中 使 用 的 是 一 种 不 常见 
的 方式 。 其 中 ,“javascript: ”表示 JavaScript 语句 前 级, 后 面 为 JavaScript 语句 。 再 如 ,一 a 
href 二 "http://www. google. com”onClick 二 "alert(' 使 用 Google 搜索 引擎 '); return 
(true)" 盖 ,注意 ,最 后 的 return(true) 语句 命名 这 个 URL 真正 被 载 信 , 当 返 回 false 时 是 不 
会 真正 载 人 http://www. google. com 这 个 地 址 的 。 


5.7.6 Table 对 象 


在 HTML 中 ,表格 是 最 重要 的 数据 组 织 和 布局 工具 ,利用 JavaScript 可 以 对 表格 进行 
插入 、 删 除 行 、 修 改 单元 格 内 容 以 及 显示 和 隐藏 等 各 种 操作 。 


1. 表格 对 象 


每 一 个 table 二 标记 ,在 内 存 都 创建 一 个 表格 对 象 ,其 属性 及 方法 见 表 5-24。 
表 5-24 Table 对 象 常用 属性 及 方法 


属 性 
id 设置 或 返回 表格 的 id 
className 设置 或 返回 表格 的 class 属性 
width 设置 或 返回 表格 的 宽度 
border 设置 或 返回 表格 边框 的 宽度 (以 像素 为 单位 ) 
cellSpacing 设置 或 返回 在 表格 中 的 单元 格 之 间 的 空白 量 ( 以 像素 为 单位 ) 
cellPadding 设置 或 返回 单元 格 边 框 与 单元 格 内 容 之 间 的 空白 量 (以 像素 为 单位 ) 
返回 表格 中 所 有 行 (TableRow 对 象 ) 的 一 个 数组 ,该 集合 包括 二 thead 二 、<<tfoot> 
ww 和 过 tbody>> 中 定义 的 所 有 行 
返回 表格 中 所 有 单元 格 的 一 个 数组 。 要 定位 一 个 i 行 j 列 的 单元 格 ,可 写 为 
cells[] 
rows[i 一 1]. cells[j—1] 
tBodies[] 返回 包含 表格 中 所 有 tbody 的 一 个 数组 
方 ”法 
createCaption() 用 于 在 表格 中 获取 或 创建 天 caption> 元 素 
deleteCaption() 从 表格 删除 caption 元 素 及 其 内 容 
createTHead() 在 表格 中 创建 一 个 空 的 tHead 元 素 
deleteTHead() 从 表格 中 删除 tHead 元 素 及 其 内 容 
createTFoot() 在 表格 中 创建 一 个 空 的 tFoot 元 素 


deleteTFoot() 从 表格 中 删除 tFoot 元 素 及 其 内 容 
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续 表 


方 法 


insertRow(index) 


在 表格 index 所 在 行 之 前 插入 一 个 新 行 ,并 返回 TableRow, 表 示 新 插入 的 行 。 
若 index 等 于 表 中 的 行 数 , 则 新 行将 被 附加 到 表 的 末尾 

如 果 表 是 空 的 , 则 新 行将 被 插 人 到 一 个 新 的 <<tbody> 段 ,该 段 自身 会 被 插 人 
表 中 


deleteRow(index) 


参数 index 指定 了 要 删除 的 行 在 表 中 的 位 置 。 行 的 编码 顺序 就 是 它们 在 文档 源 
代码 中 出 现 的 顺序 。 二 thead>> 和 二 tfoot> 中 的 行 与 表 中 其 他 行 一 起 编码 


2. 表格 行 对 象 


表格 行 对 象 TableRow 代表 一 个 HTML 表格 行 ,在 HTML 文档 中 二 tr 二 标签 每 出 现 
一 次 ,就 创建 一 个 TableRow 对 象 。 其 属性 和 方法 见 表 5-25。 


表 5-25 表格 行 对 象 TableRow 常用 属性 及 方法 
属 性 


id 


返回 行 的 id 属性 


rowIndex 


返回 某 一 行 在 表格 的 行 集合 中 的 位 置 (row index) 


innerHTML 


设置 或 返回 行 的 开始 标签 和 结束 标签 之 间 的 HTML 


cells[] 


返回 包含 行 中 所 有 单元 格 的 一 个 数组 


align 


设置 或 返回 在 行 中 的 数据 的 水 平 排列 方式 


vAlign 


设置 或 返回 在 行 中 的 数据 的 垂直 排列 方式 


方 ”法 


insertCell(index) 


在 单元 格 index 之 前 插入 一 个 新 的 单元 格 ,并 返回 TableCell 对 象 。 若 index 等 
于 行 中 的 单元 格 数 , 则 新 单元 格 将 被 附加 到 行 的 末尾 


deleteCell(index) 


3. 单元 格 对 象 


参数 index 指定 了 要 删除 的 单元 格 在 表 中 的 位 置 


单元 格 对 象 TableCell 代表 一 个 HTML 表格 单元 格 。 在 一 个 HTML 文档 中 二 td 二 标 
签 每 出 现 一 次 ,就 创建 一 个 TableCell 对 象 。 其 属性 见 表 5-26 。 


表 5-26 单元 格 对 象 TableCell 常用 属性 


属 性 说 明 
id 设置 或 返回 单元 格 的 id 
rowSpan 设置 或 返回 单元 格 可 横 跨 的 行 数 
colSpan 单元 格 横 跨 的 列 数 
width 设置 或 返回 单元 格 的 宽度 
cellsIndex 返回 单元 格 在 某 行 的 单元 格 集合 中 的 位 置 
className 设置 或 返回 元 素 的 class 属性 
innerHTML 设置 或 返回 行 的 开始 标签 和 结束 标签 之 间 的 HTML 
align 设置 或 返回 单元 格 内 部 数据 的 水 平 排列 方式 


vAlign 


设置 或 返回 单元 格 内 部 数据 的 垂直 排列 方式 


【 例 5-13】 设计 一 个 页 面 , 实 现 表 格 行 顺序 的 上 下 调整 。 

分 析 : 在 Web 开发 中 ,对 于 列表 项 ,有 时 候 需 要 调整 它们 的 显示 顺序 。 显 示 顺 序 的 调 
整 最 简单 的 方法 是 设计 一 个 顺序 编号 ,在 从 数据 库 读 出 时 , 按 顺序 编号 排序 。 男 一 种 办 法 就 
是 允许 用 户 在 客户 端 调整 。 

设 我 们 设计 的 一 个 问卷 项 目 编辑 及 项 目 顺序 调整 页 面 如 图 5-12 所 示 。 


序号 地 指标 控 作 ET 

| | 入 0) WR | Ws | Lt | TB 

| 2 | aa 和 帮 ， 并 时 间 元 00) Wa | WB | ty | 证 

| 二 我 认为 老师 对 我 们 和 码 可 条， 平易近人 (10) 修 ER | 3 上 移 下 移 

| prs AN) | Km | Bh | ty | 下 

| si 人 0) Wa | Wi | ts | TB 
单 击 页 面 上 角 的 “添加 二 部 指标 项 目 ” 可 以 为 一 人 指标 二 加 二 人 指标 项 目 


图 5-12 问卷 调查 项 目 编辑 界面 


代码 清单 : surveymodal-edit2. htm 


<html xmlns = "http://www. w3.org/1999/xhtml"> 
<head> 
<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312" /> 
< link rel = "stylesheet" type = "text/css" href = "linestable.css"> 
< script language = "JavaScript"> 
MAAN 
// 添 加 考核 项 目 
function additem( ) 
{ 
var tempstr = "<p align = left > gnbsp; 二 级 指标 : < input type = 'text' name = 'testitemname' 
maxlength= '30' size= '35>"; 
tempstr += "分 值 : < input type = 'text' name = 'scorerate' maxlength= '2' size= '2'value= '0>"; 
tempstr += "< input type = 'button' name = 'btnl' value = ' 添 加 ' onclick = 'additemsubmit() >"; 
tempstr += "< input type = 'button' name = 'btn2' value = ' 取 消 'onclick = modifyitemcancel()></p>"; 


editarea. innerHTML = tempstr; 

} 
A 
// 上 移 项 目 
function moveup( itemnum) 
{ 

Var rownum = parseInt( itemnum); 

var temp = tablel. rows(rownum). cells(1). innerText; 

tablel. rows(rownum).cells(1). innerText = tablel. rows(rownum+ 1).cells(1). innerText 

tablel. rows(rownum+ 1).cells(1). innerText = temp; 


var itemcode = tablel. rows(rownum).cells(1). itemcode; 
tablel. rows(rownum).cells(1). itemcode = tablel. rows(rownum+ 1).cells(1). itemcode; 
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tablel. rows(rownum+ 1).cells(1). itemcode = itemcode; 


} 
OANA 
// 下 移 项 目 
function movedown( itemnum) 
{ 
Var rownum = parseInt( itemnum); 
var temp = tablel. rows(rownum + 2).cells(1). innerText; 
tablel. rows(rownum + 2).cells(1). innerText = tablel. rows(rownum+ 1).cells(1). innerText 
tablel. rows(rownum + 1).cells(1). innerText = temp; 
var itemcode = tablel. rows(rownum + 2).cells(1). itemcode; 
tablel. rows(rownum + 2).cells(1). itemcode = tablel. rows(rownum + 1).cells(1). itemcode; 
tablel. rows(rownum+ 1).cells(1). itemcode = itemcode; 
} 
</script > 
</head> 
<body> 


<table class = "table frame" width= "70%" cellpadding = "0" cellspacing= "0" id= "tablel"> 
<tr height = "30"> 
<td class = "table topic" colspan = "8" align = "left"> 
<table width= "100% "height = "50" boder ="0" cellpadding = "0" cellspacing = "0"> 
<tr height = "10"> 
< td width ="550”rowspan = "2" class = "table_topic_label">< font color ="# 
FF3401"> 
【课程 问卷 管理 二 /font > 教书 育 人 (50 分 ) 二 级 指标 管理 </td> 
< td align = "center"> </td> 
</tr> 
<tr height = "20"> 
<td align= "right" style = "padding - right:10px;"><a href ="#" onclick = 
"additem( )"> 添 加 二 级 指标 项 目 </a></td> 
</tr> 
</table> 
</td> 
</tr> 
<tr height = "35"> 
<td class = "table_ head" width="10%"> 序 号 </td> 
<td class = "table_head" width= "70% "> 二 级 指标 </td> 
<td class = "table_head" colspan = "2"> 显 示 顺 序 </td> 
</tr> 
< tr height = "30"> 
<td class= "table cell" align = "center">1-1</td> 
< td itemcode = " iteml1l" class = "table_cell" align = "left" onclick = "alert (this. 
itemcode)"> 人 品 高 尚 , 有 良好 的 社会 责任 感 ,有 爱心 和 同情 心 (30 分)</td> 
<td class = "table cell" align = "center"><a href ="#" onclick = "moveup('1')"> 上 移 </a> 
</td> 
<tdclass="table cell" align= "center"><a href ="#" onclick = "movedown('1')"> 下 移 </a> 
</td> 
</tr> 
<tr height = "30"> 
<td class= "table cell" align = "center"> 1 一 2</td> 
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< td itemcode = " item1l2" class = "table cell" align = "left”onclick = "alert (this. 
itemcode)"> 具 有 良好 的 敬业 精神 (10 分 )</td> 

<td class = "table cell" align= "center"><a href = "#" onclick = "moveup( '2')"> 上 移 </a> 
</td> 

<tdclass= "table cell" align = "center"><a href ="#" onclick = "movedown('2')"> 下 移 </a> 
</td> 
</tr> 
<tr height = 60> 

< form name = "forml" method = "post" action = "surveymodal - edit2save. jsp" target ="_ 
self"> 

< input type = "hidden" name = "head2l1ist" value ="<% = head2list %>"> 

<td id= "editarea" style= "background - color: #F7FBFF;" colspan = "8"> 
单 击 页 面 右上 角 的 “添加 二 级 指标 项 目 ”, 可 以 为 一 级 指标 添加 二 级 指标 项 目 . 

</td> 

</form> 
</tr> 
</table> 
</body> 
</html > 


上 述 代码 演示 了 客户 端 强大 的 程序 功能 ,这 可 以 减少 和 Web 服务 器 的 连接 次 数 ,减少 
服务 器 的 负载 ,提高 整个 系统 的 性 能 。 上 述 示例 程序 ,有 两 处 核心 代码 。 

(1) 在 表格 第 2 列 中 ,我 们 在 二 td 二 标记 中 使 用 了 itemcode 属性 的 关于 标记 的 属性 ,这 
是 一 种 全 新 的 用 法 ,因为 在 HTML 规范 中 ,二 td 二 标记 中 无 此 属性 。 因 为 对 于 许多 标记 ,我 
们 不 仅 需要 标记 的 内 容 ( 即 innerText 和 innerHTML) ,有 时 候 还 需要 更 多 的 信息 。 

从 HTML DOM 对 象 的 思想 出 发 ,对 于 HTML 中 的 标记 ,除了 规范 给 定 的 属性 外 ,用 
户 还 可 以 根据 需要 设 定 标 记 属 性 ,JavaScript 都 将 其 转化 为 DOM 对 象 的 成 员 属 性 ,这 就 大 
大 提高 了 标记 和 HTML DOM 的 灵活 性 。 这 种 用 法 ,还 常常 用 于 复 选 框 的 分 类 等 。 

(2) 对 于 添加 项 目 函数 additem() ,示例 代码 没有 给 出 其 中 涉及 的 所 有 函数 ,但 它 演示 
了 Web 开发 中 数据 维护 的 三 个 主要 问题 : 添加 ,修改 和 删除 ,图 5-12 给 出 了 一 个 很 好 的 功 
能 组 织 界面 ,界面 友好 始终 是 Web 系统 设计 和 开发 的 重要 内 容 。 


5.7.7 Form 对 象 


在 Web 页 中 ,表单 (form) 是 人 机 交互 的 主要 手段 。 每 一 个 二 form> 标 记 都 在 内 存 中 创 
建 一 个 Form 对 象 ,Form 对 象 封 装 了 HTML 的 二 form 二 标记 。Form 对 象 属性 及 方法 见 
表 5-27。 


表 5-27 Form 对 象 常用 属性 及 方法 


一 般 属性 
id 返回 form 标记 的 id 属性 
name 设置 或 返回 表单 的 名 称 
method 设置 或 返回 将 数据 发 送 到 服务 器 的 HTTP 方法 
enctype 设置 或 返回 表单 用 来 编码 内 容 的 MIME 类 型 
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续 表 
一 般 属 性 
action 设置 或 返回 表单 的 action 属性 
target 设置 action 属性 指定 服务 器 程序 输出 结果 要 显示 的 帧 或 窗口 名 称 
length 返回 表单 中 的 元 素数 目 
elements[] 包含 表单 中 所 有 元 素 的 数组 
事件 属性 


当 用 户 单 击 表单 中 的 Submit 按钮 而 提交 一 个 表单 时 执行 该 方法 。 由 于 用 户 输入 的 
有 效 性 验证 问题 ,在 表单 中 ,通常 不 使 用 提交 (Submit) 按钮 ,而 使 用 普通 的 按钮 


Cbutton) ,在 按钮 的 onclick 事件 属性 中 首先 进行 有 效 性 验证 ,最 后 执行 document. 
form-name. submit( ) 提 交 表 单 
onreset 在 重 置 表单 元 素 之 前 调用 
方 法 
reset() 把 表单 的 所 有 输入 元 素 重 置 为 它们 的 默认 值 
ey 提交 表单 ,调用 form 的 onsubmit() 方 法 。 如 果 希 望 使 用 普通 按钮 的 提交 表单 , 则 不 


要 在 二 form> 中 设置 onsubmit 事件 属性 


在 过 form 过 中 通常 包含 了 一 系列 的 输入 元 素 , 它 们 也 被 创建 为 响应 的 对 象 ,并 被 保存 
到 Form 对 象 的 elements[ ] 中 。 对 于 输入 对 象 的 属性 和 方法 ,和 输入 标记 的 属性 对 应 ,在 此 
不 再 详细 介绍 。 


1. 访问 Form 对 象 


在 一 个 HTML 文档 中 ,可 以 包含 多 个 二 form ,因此 在 JavaScript 中 ,访问 Form 对 象 
有 多 种 实现 方法 。 

方法 一 : 通过 form 名 称 访问 。 

在 二 form 二 标记 中 ,包含 一 个 name 属性 , 它 对 应 Form 对 象 的 对 象 名 ,JavaScript 程序 
可 以 通过 表单 名 来 访问 表单 对 象 , 即 : 


obj = document. form — name 


当然 也 可 以 利用 document。 getElementsByName("form-name") 来 返回 Form 对 象 。 

方法 二 : 通过 document 对 象 forms[] 属 性 。 

除了 使 用 form 对 象 名 来 访问 页 面 中 的 表单 外 .还 可 以 通过 document 对 象 的 forms 对 
象 数组 来 访问 Form 对 象 ,有 两 种 用 法 : document. forms[numj],num 为 0,1,…, 或 者 
document. forms[ "form-name"] ,都 返回 Form 对 象 。 需 要 说 明 的 是 ,在 JavaScript 中 要 对 
form 引用 的 条 件 是 : 必须 先 在 页 面 中 用 二 form 二 标记 创建 表单 ,并 将 定义 表单 部 分 放 在 引 
用 之 前 。 


2. 访问 form 中 的 元 素 


一 个 表单 是 由 若干 的 表单 控件 组 成 的 ,这 些 控件 包括 文本 框 (text) , 单 选 按钮 (radio)、 
复 选 框 (checkbox) ,按钮 (button) 等 。 每 一 个 控件 ,在 内 存 中 都 创建 相应 的 内 存 对 象 。 在 
JavaScript 中 要 访问 这 些 基本 元 素 , 必 须 通 过 对 应 特定 的 form 元 素 的 数组 下 标 或 form 元 
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素 名 来 实现 。 每 一 个 元 素 主要 是 通过 该 元 素 的 属性 或 方法 来 引用 。 其 引用 表单 元 素 对 象 ， 
有 多 种 方法 。 
方法 一 : 通过 Form 对 象 的 elements[] 数 组 。 


Obj = document. form - name. elements["element - name"] 
方法 二 : 直接 通过 输入 元 素 名 。 
0bj = document. form — name. element — name 


两 种 方法 都 返回 表单 输入 元 素 对 应 的 DOM 对 象 。 不 同 的 form 控件 ,对 应 的 内 存 对 象 
的 属性 和 方法 也 不 相同 ,但 每 一 个 内 存 对 象 包含 的 属性 和 方法 均 与 其 对 应 的 HTML 标记 
对 应 。 例 如 ,对 于 text 内 存 对 象 ,对 应 一 个 单行 文本 框 输入 控件 。 在 HTML 中 ,标记 单行 
文本 框 text 输入 的 一 般 形式 是 : 


< input type = "text" name = "input ~ name" value = "default 一 value"> 


因此 ,对 应 于 每 一 个 text 对 象 ,其 包含 的 属性 包括 name 属性 、value 属性 等 。 对 对 象 属 
性 的 操作 , 即 通过 对 象 的 点 记 法 来 完成 , 即 : 对 象 名 . [属性 | 方法 ]。 

对 于 每 一 个 输入 对 象 ,通常 还 包含 一 组 通用 的 方法 ,如 : blur() 方 法 ,将 当前 焦点 移 到 
后 台 ; select() 方 法 ,选择 text 框 内 的 文本 。 包 含 的 事件 有 : onFocus, 当 text 获得 焦点 时 ， 


件 ; onChange, 当 元 素 值 改变 时 ,产生 该 事件 。 

【 例 5-14】 设计 一 个 用 户 信息 输入 页 面 ,完成 用 户 个 人 信息 的 填写 , 当 用 户 提交 表单 
时 ,显示 用 户 的 输入 信息 。 

分 析 : 在 上 网 过 程 中 ,数据 输入 大 都 是 通过 表单 来 完成 的 ,如 何 提 取 表 单 中 的 用 户 输入 
数据 ,包括 文本 框 , 复 选 框 单 选 按 钮 .列表 框 、 多 行文 本 框 等 输入 数据 ,以 及 对 输入 进行 控制 
和 有 效 性 验证 是 Web 编程 中 的 共性 和 基础 性 问题 。 

用 户 信 息 输入 界面 设计 如 图 5-13 所 示 。 

用 户 个 人 资料 


用 户 账户 。 [hacxv365 “(用户 帐户 不 能 自行 修改 ) 
姓名 Go | 性 别 G 男 C 女 

教育 状况 : [二 科 国 

SiEsq [| 

个 人 邮箱 ， [rvasdredren | 


个 人 兴趣 :加 体育 口音 乐 后 说 游 


自我 介绍 ; 


景 多 允许 [00 个 字 节 已 用 字 节 ;， [8 利 余 字 节 ， [72 


机 | 现 济 | 


图 5-13 表单 输入 界面 


282。 ”Web 技 术 导 论 (第 3 版 ) 


MV 


上 述 表单 包括 主要 的 输入 元 素 , 除 了 要 获取 输入 元 素 的 数值 外 ,经 常 还 需要 对 用 户 输入 
进行 控制 ,例如 : 检查 文本 框 输入 数据 的 合理 性 ,设置 文本 框 的 只 读 属性 ,限制 文本 输入 的 
字符 个 数 ,等 等 。 下 面 的 代码 是 上 述 功能 的 实现 。 

代码 清单 : personinfo. htm 


< htm]l > 
<head> 
<meta http - equiv = "Content - Type" content = "text/html;charset = gb2312"> 
<style type = "text/css"> 
body{margin - top:10px; background — color: # FFF8EB; font — size:30px;} 
td{font — size:13px} 
</style> 
< script type = "text/javascript"> 
MAA 
// 用 户 名 为 只 读 属性 
function checkname( obj) 
{ 
if (obj. readonly) alert(" 用 户 名 文本 框 为 只 读 属 性 !"); 
} 
A 
// 返 回 单 选 按钮 的 值 
function getsexval() 
{ 
Var sexValue = ""; 
for (i=0;i<forml. sex.length;i++) 
{ 
if (forml. sex[i].checked) 
{ 
sexValue = forml. sex[ i].value; 
break; 
} 
} 
return sexValue; 
} 
MAA 
// 获 取 复 选 框 选择 , 多 个 复 选 框 元 素 可 以 设置 相同 的 name 属性 
function getcheckboxval( ) 
{ 
Var likestr = ""; 
Var length = document. form1. mylike. length; 
for(i=0;i<length;i++) 
{ 
if(document. form1. mylike[ i]. checked) 
likestr += document. forml.mylike[i].value + ";"; 
} 
return likestr. substring(0, likestr. length— 1); 
} 
AAA 
// 获 取 下 拉 列 表 输 入 , 取 < optin value =></option> 中 value 的 值 ,或 标记 的 文本 
function getlistboxval(obj, str) 


if (str == "value") 
return obj. value; 
else 
return obj. options[obj. selectedIndex]. text; 
. 
A 
// 限 制 多 行文 本 域 输入 的 字符 个 数 
var LastCount = 0; 
function CountStrByte(Message, Total, Used, Remain) 
{ 
var str = Message. value; 
var length = Message.value. length; 
Var maxnum = Total.value; 
var ByteCount = 0; 
if(LastCount ! = length) 
{ 
for (i=0;i<length;i++){ 
ByteCount = (str.charCodeAt(i)<= 256) ? ByteCount + 1 : ByteCount + 2; 
if (ByteCount > maxnum) { 
Message. value = str. substring(0, i); 
alert(" 个 人 简介 最 多 不 超过 ”+ maxnum +“" 个 字 节 ! 一 个 汉字 为 两 字 节 ."); 
ByteCount = maxnum; 
break; 
} 
} 
Used. value = ByteCount; 
Remain. value = maxnum — ByteCount; 
LastCount = length; 
} 
} 
A 
// 验 证 身份 证 输入 位 数 是 否 正确 
function checkpcard( str) 
{ 
var Expression = /\d{15} |\d{18}/; 
Var objExp = new RegExp( Expression); 
if (objExp. test(str) == true) return true; 
else 
{ 
alert(" 身 份 证 位 数 不 对 !"); 
return false; 
} 
} 
W711107117110000II I 
// 验 证 邮箱 地 址 是 否 正确 
function checkemail(str) 
{ 
// 在 JavaScript 中 ,正则 表达 式 只 能 使 用 “/” 开 头 和 结束 ,不 能 使 用 双 引 号 
var Expression=/\w+ ([— +.']\wt+)x*@\Ww+([—.]\wt+t)*\.\w+([—.]\w+)*/; 
var objExp = new RegExp( Expression); 
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if (objExp. test(str) == true) return true; 
else 
{ 
alert(" 用 户 邮 箱 格式 不 正确 !"); 
return false; 
} 
} 
A 
// 数 据 有 效 性 验证 
// 提 交 用 户 输入 信息 
function formlsubmit() 
{ 
if (escape(document. form1. useraccount. value). indexOf("%u")! = —1) 
{ 
alert(" 用 户 账户 不 能 包含 汉字 ,请 重新 输入 "); 
document. form1. useraccount. focus(); 
return false; 
} 
// 6 一 20 位 的 字母 数字、 下 划 线 .句点 组 成 的 密码 
var Expression=/^[A—-2a—-z0-9]{1}([A-Za—-z0-9]|[._@]){5,19} $ /; 
var objExp = new RegExp(Expression); 
if (objExp. test(form1. password. value) == false) 
{ 
alert(" 密 码 由 6 一 20 位 的 字母 ,数字 、 点 下划线、@ 组 成 且 首 字符 为 字母 "); 
form1. password. focus(); 
return false; 
} 
if (!checkpcard( document. forml. pcard. value) ) 
{ 
document. form1. pcard. focus( ); 
return false; 
} 
if (document. forml. email. value == "") 
{ 
alert(" 必 须 填 写 用 户 邮箱 !"); 
document. forml. email. focus( ); 
return false; 
} 
if (!checkemail(document. forml. email. value)) 
{ 
document. form1. email. focus(); 
return false; 
} 
var str = "个 人 基本 信息 :\n"; 
if (document. forml. myname. value ! = "") 
str += "姓名 :" + document. forml. myname. value+ "\n"; 
str += "性 别 :" + getsexval() + "\n"; 
str += "教育 状况 :" + getlistboxval(forml. grade, 'text') + "\n"; 
str += "个 人 兴趣 :" + getcheckboxval() + "\n"; 
if (document. forml. mybrief.value ! = "") 
str += "个 人 简介 :" + document. forml. mybrief. value + "\n"; 


document. form1l. totalinfo. value = str; 
alert(document. forml. totalinfo. value); 
forml. submit( ); 
} 
</script > 
</head> 
<body> 
<table width= "500" height = "100%" cellspacing = "0" border = "0" align = "center"> 
<tr height = "100% "> 
<tdalign= "center"> 
<form name = "forml" method = "post" action = "personeditsave. jsp" target =" self"> 
<table width="100%" border = "0" cellspacing = "0" cellpadding = "0" style = "border: 1px 
solid red;padding — left:10px"> 
<tr height = "35"> 
<td colspan = "2">< img src = "square. gif" valign = "absmiddle"> 用 户 个 人 资料 </td> 
</tr> 
<tr> 
<td height = "1" colspan = "2">< img src = "line2.gif" height = "1"></td> 
</tr> 
<tr height = "30"> 
<td align = "right"> 用 户 账户 : </td> 
<td> 
< input type 
账户 不 能 自行 修改 ) 
</td> 
</tr> 
<tr height = "30"> 
<tdwidth="100" align= "right"> 姓 名 : </td> 
<td> 
< input type = "text" name = "myname" value = "Hao" readOnly = "true" 
onKeyDown = "checkname(this)"> gnbsp; 性 别 
< input type = "radio" name = "sex" value = "male" checked > 男 
< input type = "radio" name = "sex" value = "female"> 女 
</td> 
</tr> 
<tr> 
<td align= "right"> 教 育 状况 : </td> 
<tdalign= "left"> 
< select name = "grade"> 
< option value = "博士 "> 博士 </option> 
< option value = "硕士 "> 硕士 </option> 
<option value = "本 科 ”selected > 本科 </option> 
</select> 
</td> 
</tr> 
<tr height = "30"> 
<td align= "right"> 身 份 证 号 码 : </td> 
<td> 
< input type= "text" name = "pcard" maxlength= "18" size= "45"> 
</td> 
</tr> 


"text" name = "useraccount" value = "haoxw365" size= "20" disabled>( 用 户 
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<tr height = "30"> 
<tdalign = "right"> 个 人 邮箱 : </td> 
<td> 
< input type = "text" name = "email" size= "45"> 
</td> 
</tr> 
<tr> 
<td align= "right"> 个 人 兴趣 : </td> 
< td> gnbsp; 
< input type = "checkbox" name = "mylike" value = "体育 "> 体育 
音乐 "> 音乐 
< input type = "checkbox" name = "mylike" value = "旅游 "> 旅游 
</td> 
</tr> 
<tr height = "30"> 
<td align = "right"> 自 我 介绍 : </td> 


<td> 
< textarea name = "mybrief" cols = "45" rows = "6" 
onKeyDown = " CountStrByte (this. form. mybrief, this. form. total, this. form. used, this. 
form. remain);" 
onKeyUp = " CountStrByte ( this. form. mybrief, this. form. total, this. form. used, this. 
form. remain);"> 
</textarea> 
</td> 
</tr> 
<tr> 


<td colspan = "2" align = "center"> 最 多 允许 
< input type ext" name = "total" value = "100" siz 


"disabled > 个 字 节 已 用 字 节 : 


< input type = "text" name = "used" value = "0" size = "3" disabled> 剩 余 字 节 : 
< input type = "text" name = "remain" value = "100" size = "3" disabled> 
</td> 
</tr> 


<tr height = "30"> 
<td colspan= "2" align= "center"> 


< input type = "button" name = "myok" value = "确定 " onclick = "formlsubmit();"> &nbsp; 
< input type = "reset" name = "mycan" value = "取消 "> 
</td> 
</tr> 
</table> 


< input type = "hidden" name = "useraccount" value = "sdu12345"> 
< input type = "hidden" name 
< input type = "hidden" name 
</form> 

</td> 

</tr> 

</table> 

</body> 

</html > 


对 于 上 述 代码 ,说明 如 下 。 
(1) 在 文档 的 头 部 ,我 们 定义 了 嵌入 式样 式 表 ,在 二 body 二 样式 定义 中 ,只 对 二 body 二 


password" value = "111111"> 
totalinfo" value= ""> 


第 5 章 “客户 端 编程 


内 的 二 p 二 等 有 影响 ,其 font-size 不 影响 表格 中 的 文字 ,要 设置 表格 中 文字 的 大 小 ,只 能 在 
去 td> 标 记 中 设置 ,即使 在 天 table> 中 设置 同样 无 效 。 

(2) 关于 表格 线 ,在 二 table 之 中 设置 border 二 1, 则 表格 的 表格 、 单 元 格 都 含有 表格 线 ， 
设置 二 table 二 的 style 二 "border: 1px solid red", 则 只 有 表格 四 周 的 边线 。 单 元 格 无 表 
格 线 。 

(3) 表单 提交 按钮 设计 为 Button 类 型 ,而 不 是 Submit 类 型 ,主要 是 增加 可 读 性 ,在 
formlsubmit() 中 进行 数据 的 有 效 性 验证 。 

(4) 对 于 JavaScript 函数 ,参数 基本 上 有 两 类 ,一 类 是 字符 串 , 男 一 类 是 对 象 。 例 如 ， 
checkemail() ,如 果 参 数 是 对 象 , 则 调用 时 可 使 用 checkemail(this) ,在 函数 内 部 很 容易 取 对 
象 的 value 值 , 如 果 参 数 是 字符 串 ,实际 参数 就 写 为 this. value, 即 当前 文本 框 的 value 值 。 

(5) 表单 中 使 用 了 hidden 输入 ,主要 用 于 客户 端 和 服务 端 之 间 的 数据 交换 ,如 果 是 服 
务 器 页 (如 jsp) ,很 容易 把 服务 端的 数据 通过 hidden 传递 ,例如 : 二 input type 王 hidden 
name 一 "nowdate" value 王 "所 % 三 new Date()% 二 ", 这 样 客户 端 就 得 到 了 服务 器 上 的 
时 钟 。 


5.7.8 Event 对 象 

在 网 页 浏览 中 ,会 有 各 种 各 样 的 鼠标 和 键盘 操作 ,这 些 事件 的 发 生 , 都 在 内 存 中 创建 
Event 对 象 , Event 对 象 封装 了 键盘 按键 的 状态 .鼠标 指针 的 位 置 、 鼠 标 按键 的 状态 等 信息 。 

1. Event 对 象 常用 属性 

Event 对 象 属性 见 表 5-28 。 


表 5-28 Event 对 象 常用 属性 


属 性 说 明 
clientX clientY 返回 当 事 件 被 触发 时 ,鼠标 指针 的 X、Y 坐标 
ScreenX screenY 返回 当 事 件 被 触发 时 ,相对 于 屏幕 的 横 坐 标 和 列 坐标 
返回 一 个 整数 ,指示 当 事 件 被 触发 时 哪个 鼠标 按键 被 按 下 ,0、1、2 分 别 代表 鼠标 


button 


左 键 、 中 键 和 右键 
ctrlIKey 返回 一 个 布尔 值 , 指 示 当 事件 发 生 时 ,Ctrl 键 是 否 被 按 下 并 保持 住 
altKey 返回 一 个 布尔 值 ,指示 在 指定 的 事件 发 生 时 ,Alt 键 是 否 被 按 下 并 保持 住 
shiftKey 返回 一 个 布尔 值 ,指示 当 事 件 发 生 时 ,Shift 键 是 否 被 按 下 并 保持 住 
返回 与 事件 的 目标 节点 相关 的 节点 。 对 于 mouseover 事件 来 说 ,该 属性 是 鼠标 
TelatedTarget 指针 移 到 目标 节点 上 时 所 离开 的 那个 节点 。 对 于 mouseout 事件 来 说 ,该 属性 是 
离开 目标 时 ,鼠标 指针 进入 的 节点 。 对 于 其 他 类 型 的 事件 来 说 ,这 个 属性 没有 用 
type 返回 当前 Event 对 象 表示 的 事件 的 名 称 
target 返回 事件 的 目标 节点 对 象 (触发 该 事件 的 节点 ), 如 生成 事件 的 元 素 ,文档 或 窗口 


对 于 keypress 事件 ,该 属性 声明 了 被 敲 击 的 键 生成 的 Unicode 字符 码 。 对 于 
keydown 和 keyup 事件 , 它 指定 了 被 敲 击 的 键 的 虚拟 键盘 码 
cancelBubble 如 果 事 件 句 柄 想 阻 止 事件 传播 到 包容 对 象 ,必须 把 该 属性 设 为 true 


keyCode 
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2. 可 能 的 事件 


在 浏览 器 中 可 能 的 事件 主要 有 : onclick (鼠标 单 击 )、ondblclick (鼠标 双击 )、 
onmousedown( 按 下 鼠标 按键 ) .onmousemove( 鼠 标 移 动 ) .onmouseout( 鼠 标 指针 从 某 元 素 
移 开 ) ,onmouseover( 鼠 标 指针 移 到 某 元 素 之 上 ) .onmouseup( 松 开 鼠 标 按 键 ) .onkeydown 
( 按 下 键盘 按键 ) .onkeypress( 按 下 并 松 开 键盘 按键 ) .onkeyup( 松 开 键盘 按键 ) .onfocus( 元 
素 获 得 焦点 )、onblur (元 素 失 去 焦点 )、onchange (改变 域 的 内 容 )、onselect (选中 文本 )、 
onload( 网 页 或 一 幅 图 像 完 成 加 载 ) .onunload( 退 出 页 面 ) .onabort( 图 像 加 载 中 断 ) .onerror 
(加 载 文 档 或 图 像 时 出 错 )、onresize (调整 窗口 或 框架 大 小 )、onreset( 单 击 “ 重 置 ” 按 钮 )、 
onsubmit( 单 击 “ 提 交 ” 按 钮 ) 等 。 

【 例 5-15】 编写 输入 元 素 事 件 处 理 函 数 , 当 按 Enter 键 时 ,将 输入 焦点 自动 移动 到 下 一 
个 输入 元 素 。 

分 析 : 在 使 用 表单 输入 时 ,默认 情况 下 , 按 Enter 键 , 则 提交 表单 。 这 可 能 不 符合 我 们 
的 交互 习惯 ,我 们 的 一 般 习惯 是 , 按 Enter 键 后 ,使 输入 焦点 移 向 下 一 个 表单 元 素 , 而 不 是 提 
交 表 单 。 

代码 清单 : 

< script type = "text/javascript"> 

function myenter (nextobj) 

: if (event. keyCode == 13) 

nextobj. focus(); 

ees 

然后 在 每 一 个 Input 控件 中 ,可 以 修改 onkeypress 事件 属性 为 onkeypress 一 "myenter 
(下 一 个 输入 元 素 )"。 例 如 : 

< form name = "forml"> 

< input type = "text" name = "useraccount" onkeypress = "myenter(forml. password)" /> 


< input type = "text" name = "password" onkeypress = "myenter(forml. username)" /> 
</form> 


则 用 户 输入 完 用 户 账户 后 , 按 Enter 键 ,输入 焦点 将 转 到 name 王 "password" 的 输入 框 。 


5.7.9 应 用 举例 


在 Web 系统 的 开发 中 ,表格 和 表单 是 使 用 最 多 的 页 面 元 素 ,利用 JavaScript 可 以 动态 
地 在 表格 中 插入 、 删 除 表格 行 ,同时 也 可 以 隐 茂 表格 行 和 单元 格 。 结 合 表单 输入 ,通过 表格 
来 显示 ,实现 一 种 类 似 数据 库 记 录 的 输入 界面 ,最 后 一 次 性 提交 到 Web 服务 器 。 

在 我 们 进行 GSL 系统 的 研发 中 ,设计 了 考试 模型 的 编辑 界面 ,对 于 每 一 类 答题 , 列 出 题 
库 中 的 题目 ,选择 需要 的 题目 ,并 给 定 分 值 , 最 后 提交 。 界 面 如 图 5-14 所 示 。 

分 析 : 采用 一 iframe> 来 显示 下 部 的 列表 ,正常 运行 时 ,列表 来 自 数据 库 查 询 所 得 数据 。 
在 列表 项 右 侧 , 单 击 “ 添 加 ”按钮 , 则 相应 的 项 目 添加 到 上 部 的 已 选 题目 列表 ,对 已 选 题目 列 
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题目 代 玛 | 


201107001 [tine 


201107002 


5-14 考试 模型 编辑 设计 页 面 


表 中 的 题目 ,如 果 要 放弃 选择 , 单 击 右 侧 的 “取消 选 定 ?按钮 即 可 。 最 后 单 击 * 确 定 ? 按 钮 ,将 
所 选 题目 列表 发 送 到 服务 器 ,更 新 数据 库 中 的 课程 考试 模型 。 

界面 设计 两 个 HTML 文件 ,一 个 为 主体 页 面 对 应 的 html 文件 ,文件 名 为 tableformmain. 
htm, 另 一 个 为 一 iframe 二 中 显示 的 文件 ,文件 名 为 tableformlist. htm。 

(1) tableformmain. htm 代码 清单 如 下 : 


< htm] > 
<head> 
<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312"> 
< link rel = "stylesheet" type = "text/css" href = "frametable.css"> 
< link rel = "stylesheet" type = "text/css" href = "common. css"> 
< Script> 
MAAN 
// 动 态 在 表格 中 添加 一 行 
// 子 窗口 调用 的 函数 , 必须 单独 写 在 一 个 独立 的 脚本 定义 段 内 ,否则 ,出 错 
function addonerow( str) 
站 

if (tablel. rows(1). id== "row0") 

{ 

//alert(" 第 一 次 添加 .…"), 提 示 信 息 占用 了 一 行 ,需要 隐藏 掉 , 以 免 丰 人 数据 库 
document.all. item( 'row0'). style. display = "none" 

} 

var s= new Array(2); 

var chl = "\20"; 

s= str.split(chl); 

Var rowsnum = document.all.tablel. rows. length; 

Var newRow, newCell; 

// 在 最 后 一 行 的 前 面 插入 一 行 , 每 行 4 个 单元 格 ,并 设置 行 的 id 属性 

var newRow = tablel. insertRow(rowsnum 一 1); 

newRow. jd = "row" + rowsnum; 
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for(var j=0;j<4;j++) 
{ 
newCell = newRow. insertCell(j); 
} 
// 焉 浏览 器 动态 设置 样式 不 能 直接 给 行 或 列 指定 class 属性 
// 要 先 把 样式 放 到 一 个 对 象 的 attribute 中 ,然后 再 把 这 个 对 象 设置 到 行 或 列 中 


// 第 1 列 

var objStyle = newRow.cells(0).getAttribute("style"); 
if (objStyle == "[object]") 

{ 


objStyle. setAttribute("cssText", "font — size:12px;color: # 333333; background - color: 
#b3cfe4;"); 
newRow. cells(0). setAttribute("style", objStyle); 


else 
{ 
newRow. cells(0). setAttribute("class", "textrow" ); 
} 
// 第 2 列 
objStyle= newRow.cells(1).getAttribute("style"); 
证 (objStyle == "[object]") 
{ 
objStyle. setAttribute("cssText", "font — size:12px;color: # 333333; background — color: 
#b3cfed;"); 
newRow. cells(1). setAttribute("style", objStyle); 
else 
{ 
newRow. cells(1). setAttribute("class", "textrow" ); 
} 
// 第 3 列 
objStyle= newRow.cells(2).getAttribute("style"); 
if (objStyle == "[object]") 
{ 
objStyle. setAttribute("cssText", "font - size:12px;color: # 333333; background - color: 
#b3cfed4;"); 
newRow. cells(2). setAttribute("style", objStyle); 
} 
else 
| 
newRow. cells(2). setAttribute("class", "textrow"); 
} 
// 第 4 列 
objStyle= newRow.cells(3).getAttribute("style"); 
if (objStyle == "[object]") 
{ 
objStyle. setAttribute("cssText", "font — size:12px;color: # 333333; background — color: 
#b3cfed;"); 
newRow. cells(3). setAttribute("style", objStyle); 
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else 
{ 
newRow. cells(3). setAttribute("class", "textrow"); 
} 
// 为 新 添加 的 行 的 各 个 单元 格 赋值 
newRow. cells(0). innerText = s[0]; 
newRow. cells(0).align= "center"; 
newRow. cells(0).width= "15%"; 


newRow. cells(1). innerText = s[1]; 
newRow. cells(1).align= "left"; 
newRow. cells(1).width= "60%"; 


newRow. cells(2). innerHTML = "分 数 : < input type = 'text' name = 'score' maxlength= '3'size= 
'2'value = '0'onblur = \"checkscore(this)\">"; 

newRow. cells(2).align= "center"; 

newRow. cells(2).width= "10%"; 


newRow. cells(3). innerHTML = "< input type = 'button'name = 'btn' value = ' 取 消 选 定 'onclick= 
\"cancelselect('row" + rowsnum + "')\">"; 
newRow. cells(3).align= "center"; 


//newRow. height = "30"; 

window. scrollTo( 0, document. body. scrollHeight); 
} 
</script > 


<script> 
A 
// 检 查 输入 的 分 数 是 否 合适 
function checkscore(obj) 
{ 
Var scorestr = obj. value; 
var Expression= /^\d{1,3} $ /; 
var objExp = new RegExp(Expression); 
if (objExp. test(scorestr) == false) 
{ 
alert(" 数 字 为 不 大 于 100 的 整数 !"); 
thisobj. focus( ); 
return false; 
} 
return true; 
} 
A 
// 隐 藏 一 个 id 所 标记 的 区 域 ,如 div、 表 格 行 .单元 格 等 
// 当 一 个 过 标记 的 对 象 隐藏 显示 后 ,其 值 不 可 访问 ,出 现 undefined 提示 
function cancelselect(area) 
{ 
if (document.all. item(area). style. display == "none") 
document.all. item(area). style. display = "block"; 
else 
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document.all. item(area). style. display = "none"; 


} 


A 
// 将 用 户 选择 的 题目 ,形成 testcodelist 列表 传 回 服务 器 保存 到 数据 库 
// 
function formlsubmit() 
{ 
// 将 表格 中 的 内 容 形 成 一 个 考试 题 串 ,题目 之 间 用 "\20" 分 开 
var tempstr = "", sl, s2, s3; 
var rowsnum, i= 0,j=1,k; 
rowsnum = document.all. tablel. rows. length; 


// 只 有 三 行 , 且 第 一 行 是 提示 行 , 则 表明 无 数据 
if (rowsnum == 3 && tablel. rows(1). id== "row0") 
return false; 


// 第 一 行 ,第 二 行 (隐藏 ). 最 后 一 行 不 是 题目 数据 
var totalscore= 0; 
for (i=1;i<rowsnum— 1;i++) 
{ 
证 (tablel. rows(i). style. display! = "none") 
{ 
sl = tablel. rows(i).cells(0). innerText; 
s2= tablel. rows(i).cells(1). innerText; 
// 只 有 一 条 记录 时 , score 未 形成 数组 ,分 两 种 情况 
if (rowsnum == 3 && tablel. rows(1). id! = "row0" | | rowsnum == 4 && tablel. rows(1). id 
== "row0") 
s3= forml. score. value; 
else 
if (tablel. rows(1). id== "row0") 
s3= forml. score[i— 2].value; 
else 
s3= forml. score[i—1].value; 
i 
totalscore += parseInt(s3,10); 
} 
} 
// 原 先 有 数据 ,但 取消 了 所 有 的 行 , 即 指定 的 题目 列表 变 为 空 
if (tempstr! ="" && totalscore! = 100) 
{ 
alert(" 已 选 题目 总 分 为 : ”+ totalscore + ", 总 分 应 为 100 分 ") 
return false; 
} 
forml. testitemlistnew. value = tempstr; 
form1. submit( ); 
} 
</script > 
</head> 


<body style= "margin— top:0px;"> 


< form name = "forml" action= "tableformmainsave. jsp"> 


< input type= "hidden" name = "oneteststr" value 
< input type = "hidden" name = "testitemlistnew" value= ""> 


<table id = "tablel" width= "100%" class= "info- table" cellspacing = "0"> 
<tr height = "35"> 
<td class = "titlerow" colspan = "4" align = "left"> 已 选 题目 </td> 
</tr> 
<tr height = "35" id= "row0"> 
<td class = "table_head" width = "15$% "> 题目 代码 </td> 
<td class = "table_head" width = "60% "> 题目 名 称 </td> 
<td class = "table_head" width= "10% "> 分 值 比例 </td> 
<td class = "table_head"> 操 作 </td> 
</tr> 
<tr height = "30"> 
<td class = "bottomrow" colspan= "4" align = "right"> 
< input type = "button" name = "btn2” value = "确定 " onclick = "formlsubmit()"> 
< input type = "button" name = "btn2" value= "取消 "> 
</td> 
</tr> 
</table> 
</form> 


<table id = "table2" width= "100%" class= "info- table" cellspacing = 
<tr> 
<td colspan = "3"> 
< iframe name = "testlistframe" src = "tableformlist. htm" width= "100%" height = "330" 
frameborder = "0" scrolling = "yes"> 
</iframe> 
</td> 
</tr> 
</table> 
</body> 
</html > 


(2) <iframe> 内 显示 的 文件 tableformlist. htm 的 代码 清单 如 下 : 


<html xmlns = "http://www. w3.org/1999/xhtml"> 
<head> 
<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312" /> 
< link rel = "stylesheet" type = "text/css" href = "linestable.css"> 
< link rel = "stylesheet" type = "text/css" href = "common. css"> 
< script> 
MAA 
// 实 现 iframe 内 部 页 面 直接 调用 该 iframe 所 属 父 窗口 自 定义 函数 的 方法 
// 比 如 有 A 窗口 ,A 内 有 个 iframe B,B 中 装载 的 是 C 页 面 
function toaddonerow( itemnum) 
{ 
// 将 题目 串 付 给 父 窗 口 的 隐藏 变量 
Var str; 
var chl = "\20"; 
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str = eval("item" + itemnum + "1. innerText") + chl; 
str +=eval("item" + itemnum + "2. innerText"); 


// 调 用 父 窗口 函数 ,在 已 选 列表 中 新 添加 的 题目 显示 
Window. parent. forml. oneteststr. value = str; 
window. parent. addonerow( str); 

} 

</script > 

</head> 


<body> 
<table class = "table frame" width= "100%" cellpadding = "0" cellspacing = "0"> 
<tr height = "35"> 
<td class = "table_head" width= "15% "> 题目 代码 </td> 
<td class= "table_head" width= "75$% "> 题目 名 称 </td> 
<td class = "table_head"> 操 作 </td> 
</tr> 
<tr height = "30"> 
<td id= "iteml1" class = "table cell" align = "center"> 201107001 </td> 
<td id= "item12" class = "table cell" align = "left"> Linel .</td> 
<td class = "table cell" align= "center"><a href ="#" onclick= "toaddonerow('1')"> 添 加 
</a></td> 
</tr> 
<tr height = "30"> 
<td id = "item21" class = "table cell" align = "center"> 201107002 </td> 
<td id = "item22" class = "table cell" align = "left"> Line2…</td> 
< td class = "table cell" align = "center"><a href ="#" onclick = "toaddonerow( '2')"> 添 加 
</a></td> 
</tr> 
</table> 
</body> 
</html > 


上 述 页 面 较 好 地 使 用 了 表单 .表格 操作 .同时 用 到 了 一 iframe 二 等 技术 ,在 Web 开发 中 
具有 较 好 的 参考 价值 。 主 要 技术 点 有 如 下 几 个 。 

(1) 一 个 页 面 中 调用 另 一 个 页 面 的 函数 的 方法 ,以 及 为 男 一 个 页 面 的 变量 赋值 。 

(2) 对 于 过 form 之 中 输入 标记 的 name 重 名 问题 。 在 JavaScript 中 ,允许 多 个 输入 域 具 
有 相同 的 name 值 。 例 如 : 本 题 中 的 分 数 , 如 果 有 两 行 或 以 上 , 则 有 多 个 name 王 "score "的 
输入 文本 框 ,对 于 多 个 score,JavaScript 将 创建 一 个 数组 对 象 来 存储 ,数字 名 为 score。 但 
是 ,在 系统 运行 时 ,如 果 是 一 行 , 则 只 能 创建 一 个 简单 的 DOM 对 象 ,而 不 是 数组 。 这 是 在 程 
序 调 试 时 最 容易 遇 到 的 问题 。 

(3) 动态 的 表格 处 理 , 单 元 格 样式 设置 是 一 个 难点 ,各 个 列 的 样式 类 似 , 但 必须 分 别 设置 。 


6.8 使 用 AJAX 技术 


在 Web 应 用 蓬勃 发 展 的 今天 ,新 的 技术 不 断 出 现 。 在 客户 端 编程 方面 , 继 DOM 之 后 ， 
为 了 更 新 页 面 局 部 的 需要 ,出 现 了 AJAX 技术 , 它 开 创 了 一 种 新 的 JavaScript 编程 的 思路 和 
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方法 。AJAX 技术 一 旦 出 现 ,就 受到 了 开发 人 员 的 欢迎 ,并 得 到 了 迅速 的 发 展 ,并 被 广泛 应 
用 于 许多 需要 实时 刷新 的 页 面 中 。 


5.8.1 AJAX 基础 


AJAX 技术 是 由 Jesse James Garrett 于 2005 年 2 月 在 一 篇 文章 中 提出 来 的 ,是 
Asynchronous JavaScript and XML( 异 步 JavaScript 和 XML) 的 缩写 ,AJAX 提供 与 服务 器 
异步 通信 的 能 力 ,一 个 最 简单 的 应 用 是 无 须 刷新 整个 页 面 而 在 网 页 中 更 新 一 部 分 数据 。 当 
时 ,AJAX 只 是 一 种 设想 ,其 灵感 来 源 于 需要 用 Flash 来 实现 一 些 网 络 应 用 的 功能 ,但 是 ,由 
于 对 Flash 的 不 熟悉 ,尝试 用 传统 的 Web 技术 来 达到 Flash 的 效果 , 即 用 JavaScript 和 
XML 这 两 种 传统 的 Web 技术 来 实现 ,这 就 出 现 了 AJAX 的 概念 。 现 在 ,这 个 术语 已 经 用 
来 泛 指 所 有 允许 浏览 器 在 不 刷新 整个 页 面 的 情况 下 与 服务 器 通信 的 技术 。 

什么 是 AJAX 技术 呢 ? AJAX 技术 实际 上 是 把 JavaScript\CSS`DOM 和 HTML 结合 
起 来 的 一 种 新 用 法 。 这 种 结合 并 不 是 新 概念 ,在 动态 HTML 中 ,人 们 已 经 将 这 些 技术 结合 
在 一 起 使 用 了 ,AJAX 技术 的 独到 之 处 在 于 它 在 服务 器 端 使 用 了 异步 (Asynchronous) 处 理 
技术 。 

Web 应 用 软件 在 运行 时 需要 大 量 的 页 面 ,用 户 在 网 页 上 输入 数据 时 , 单 击 “ 提 交 ” 按 钮 ， 
客户 端 浏览 器 则 把 这 些 信息 发 送 到 服务 器 端 , 服 务 器 根据 用 户 的 操作 发 送 一 个 新 页 面 到 客 
户 端 。 例 如 ,在 一 个 登录 页 面 中 ,除了 登录 表单 ,页面 上 通常 还 包含 网 站 品牌 信息 、 导 航 条 和 
版 权 声明 等 。 对 于 传统 的 登录 页 面 , 当 用 户 提交 表单 后 ,服务 器 将 比较 用 户 在 表单 中 输入 的 
数据 与 数据 库 中 保存 的 登录 信息 是 否 一 致 。 如 果 用 户 输入 的 数据 不 正确 ,服务 器 就 把 与 原 
来 相同 的 登录 页 面 重 发 给 用 户 ,而 这 个 页 面 与 原来 的 页 面相 比 可 能 只 是 多 了 "登录 失败 ”的 
消息 。 为 了 这 小 小 的 改变 必须 重新 传输 整个 网 页 。 用 户 每 发 出 一 个 请 求 , 整 个 网 页 就 要 被 
刷新 一 次 , 即 页 面 的 加 载 与 用 户 的 请 求 是 同步 的 。 

刷新 整个 页 面 除了 带 来 较 大 的 网 络 流量 外 ,对 于 一 些 聊天 类 的 网 站 ,频繁 的 页 面 刷 新 必 
然 会 产生 闪烁 ,影响 用 户 的 视觉 体验 。 当 采用 AJAX 技术 后 ,情况 将 会 大 大 改善 , 当 用 户 提 
交 表 单 后 ,如 果 登 录 失 败 ,将 不 再 刷新 整个 网 页 ,而 是 仅仅 在 页 面 上 增加 了 “登录 失败 ”的 消 
息 文本 , 即 AJAX 技术 可 以 实现 网 页 的 局 部 刷新 ,而 页 面 上 的 所 有 没有 被 刷新 的 信息 都 是 
提交 表单 前 页 面 的 内 容 。 这 无 论 是 对 于 服务 器 的 CPU 开销 还 是 对 网 络 的 传输 开销 ,无 疑 
都 减轻 了 不 少 压 力 , 也 避免 了 页 面 闪烁 现象 的 发 生 。 

总 之 ,AJAX 是 一 种 客户 端 实现 方法 ,开发 人 员 不 需要 学 习 一 种 新 的 语言 ,在 大 多 数 现 
代 浏 览 器 中 都 能 使 用 。AJAX 不 关心 服务 器 是 什么 ,使 用 AJAX 技术 ,不 必 丢 掉 原先 掌握 
的 服务 器 端 技术 , 它 可 以 与 ASP、JSP、PHP 等 服务 端 脚本 交互 。 尽 管 存在 一 些 很 小 的 安全 
限制 ,网 站 设计 者 还 是 可 以 充分 利用 原 有 的 知识 ,很 容易 地 使 用 AJAX 技术 。 


5.8.2 XMLHttpRequest 对 象 


AJAX 技术 的 组 成 元 素 涉及 JavaScript、.CSS.DOM、XML HTTP 和 XML 等 内 容 , 对 于 
JavaScript、CSS、DOM 和 XML, 在 前 面 的 章节 中 都 已 经 做 了 较 全 面 的 介绍 ,本 节 将 详细 介 
绍 XML HTTP 相关 对 象 的 概念 及 使 用 方法 。 
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1. XMLHttpRequest 对 象 


1999 年 春 , 在 IE 5.0 中 ,增加 了 一 个 新 的 ActiveX 控件 , 即 XMLHttpRequest 对 象 
(XHR) ,当时 ,这 个 对 象 主要 是 在 IE 中 使 用 。 从 Mozilla 1. 0 和 Safari 1. 2 开始 ,对 XHR 对 
象 的 支持 开始 普及 。 这 个 很 少 使 用 的 对 象 和 相关 的 基本 概念 甚至 已 经 出 现在 W3C 标准 
中 , 即 DOM Level 3 加 载 和 保存 规约 (DOM Level 3 Load and Save Specification) 。 现 在 , 特 
别 是 随 着 Google Maps、Google Suggest、Gmail、Flickr、Netflix、A9 等 应 用 变 得 越 来 越 炙 手 
可 热 ,XHR 已 经 成 为 事实 上 的 标准 ,是 AJAX 技术 的 核心 组 成 部 分 。 

XMLHttpRequest 对 象 位 于 客户 端 浏览 器 中 ,是 用 来 实现 网 页 与 Web 服务 器 之 间 异 步 
通信 的 对 象 , 通 过 它 可 以 在 不 进行 整个 网 页 刷新 的 情况 下 向 服务 器 发 出 请 求 ,接收 响应 等 工 
作 。AJAX 技术 工作 机 制 如 图 5-15 所 示 。 


支持 AJAX 的 
Web 页 面 rt 号 


L 
Web 服 务 器 


响应 处 
客户 端 | | 理 程序 


图 5-15 AJAX 技术 工作 机 制 


对 于 一 个 支持 AJAX 的 Web 面 来 说 ,与 服务 器 进行 异步 数据 通信 的 过 程 如 下 。 

(1) 当 要 求 进行 与 服务 器 异步 通信 的 某 一 事件 发 生 时 ,事件 处 理 程序 将 调用 XHR., 设 
置 该 对 象 相关 的 属性 参数 。 

(2) 由 XHR 向 服务 器 发 出 请 求 ,请求 通 过 Internet 发 送 到 Web 服务 器 。 当 服务 器 收 
到 请 求 后 ,运行 指定 的 服务 器 端 程序 。 

(3) 服务 器 端 程序 执行 中 如 果 包 含 数据 库 访 问 的 命令 , 则 连接 数据 库 服务 器 完成 数据 
库 的 相关 操作 ,结果 返回 到 Web 服务 器 。 

(4) Web 服务 器 将 响应 信息 通过 Internet 发 回 到 客户 端 ,浏览 器 将 这 些 响 应 信息 交 给 
Web 页 面 的 XHR 对 象 。 

(5) 启动 相应 的 处 理 程序 .通过 该 文档 的 DOM 模型 完成 页 面 的 更 新 工作 。 

AJAX 技术 等 于 在 客户 端 页 面 和 服务 器 之 间 安 插 了 一 个 中 转 站 ,JavaScript 脚本 先 把 
请 求 从 页 面 发 送 给 这 个 中 转 站 ,再 由 这 个 中 转 站 把 请 求 发 给 服务 器 ; 服务 器 对 请 求 处 理 后 ， 
先 把 响应 发 给 中 转 站 ,再 由 中 转 站 将 响应 转发 给 页 面 ,客户 端 页 面 的 脚本 程序 就 可 以 根据 收 
到 的 数据 进行 网 页 的 更 新 工作 。 这 个 中 转 站 的 角色 就 由 客户 端的 XMLHttpRequest 对 象 
承担 。 在 客户 端的 响应 数据 处 理 程序 一 般 为 XHR 对 象 状 态 改变 的 事件 处 理 函数 ,具体 的 
网 页 更 新 工作 可 通过 当前 页 面 的 DOM 模型 完成 。 


2. 创建 XMLHttpRequest 对 象 


在 使 用 XMLHttpRequest 对 象 之 前 ,必须 先 创建 一 个 XMLHttpRequest 对 象 。 由 于 
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XMLHttpRequest 不 是 一 个 W3C 标准 ,因此 需要 针对 不 同 的 浏览 器 采用 不 同方 法 创建 
XMLHttpRequest 的 实例 。Internet Explorer 把 XMLHttpRequest 实现 为 一 个 ActiveX 对 
象 , 其 他 浏览 器 (如 Firefox、Safari 和 Opera) 把 它 实 现 为 一 个 本 地 JavaScript 对 象 。 由 于 存 
在 这 些 差别 ,JavaScript 代码 中 必须 包含 有 关 的 逻辑 ,从 而 使 用 ActiveX 技术 或 者 使 用 本 地 
JavaScript 对 象 技术 来 创建 XMLHttpRequest 的 一 个 实例 。 

在 这 里 为 了 明确 该 如 何 创建 XMLHttpRequest 对 象 的 实例 ,并 不 需要 那么 详细 地 编写 
代码 来 区 别 浏览 器 类 型 ,只 是 检查 浏览 器 是 否 提供 对 ActiveX 对 象 的 支持 。 如 果 浏 览 器 支 
持 ActiveX 对 象 ,就 可 以 使 用 ActiveX 来 创建 XMLHttpRequest 对 象 。 否 则 ,就 要 使 用 本 
地 JavaScript 对 象 技术 来 创建 。 可 以 通过 以 下 函数 创建 XMLHttpRequest 对 象 : 


Var xmlHttp; 


function createXMLHttpRequest() 
{ if (window. ActiveXObject) 
xmlHttp = new ActiveXObject("Microsoft. XMLHTTP" ); 
else if (window. XMLHttpRequest) 
xmlHttp = new XMLHttpRequest(); 


} 


在 这 里 ,变量 xmlHttp 保存 了 XMLHttpRequest 对 象 新 创建 的 一 个 实例 ,如 果 创 建 失 
败 ,xmlHttp 的 值 将 为 null。 通 过 该 对 象 的 属性 和 方法 ,可 以 很 容易 地 与 服务 器 实现 请 求 的 


发 送 和 响应 的 接收 。 


3. XMLHttpRequest 对 象 的 属性 和 方法 


XMLHttpRequest 对 象 常用 属性 及 方法 见 表 5-29 。 
表 5-29 XMLHttpRequest 对 象 常用 属性 及 方法 


属 性 

onreadystatechange 状态 改变 时 发 生 的 事件 ,可 以 将 它 与 一 个 JavaScript 函数 绑 定 
es 请 求 的 状态 。 有 5 个 可 能 的 取 值 (0: 未 初始 化 ,1: 正 在 加 载 ,2: 已 加 

载 ,3: 交 互 中 ,4 :完成 ) 
responseText 服务 器 的 响应 ,表示 为 一 个 串 
responseXML 服务 器 的 响应 ,表示 为 XML。 可 以 解析 为 一 个 DOM 对 象 
Status 服务 器 的 HTTP 状态 码 。 例 如 ,200:OK,404:Not Found, 等 等 
statusText HTTP 状态 码 的 相应 文本 。 例 如 ,OK 或 Not Found( 未 找到 ) 等 


方 法 


open(method, url, asynch) 


建立 对 服务 器 的 请 求 , 即 设置 对 应 服务 器 端的 异步 通信 程序 , URL 
为 服务 器 端 程序 的 URL 


send(content) 向 服务 器 发 送 请 求 

setRequestHeader 〈 header，| 把 指定 首部 设置 为 所 提供 的 值 。 在 设置 任何 首部 之 前 必须 先 调用 
value) open() 

abort() 停止 当前 请 求 

getAllResponseHeaders() 把 HTTP 请 求 的 所 有 响应 首部 作为 键 / 值 对 返回 
getResponseHeader(header) 返回 指定 首部 的 串 值 
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下 面 详细 介绍 这 几 个 方法 的 应 用 。 

(1) void open (string method, string url[, boolean asynch][, string username] 
[，string password]) : 建立 对 服务 器 的 调用 ,这 是 初始 化 一 个 请 求 的 纯 脚 本 方法 。 参 数 说 
明 如 下 。 

Q method: 必 选 参数 ,提供 调用 的 特定 方法 (GET .POST 或 PUT) 。 

@ url: 必 选 参数 ,所 调用 资源 的 URL, 即 服务 器 端 处 理 程序 。 

@ asynch: 必 选 参数 ,指示 这 个 调用 是 异步 的 还 是 同步 的 。 默 认 值 为 true, 如果 为 
false, 处 理 器 就 会 等 待 , 直 到 从 服务 器 返回 响应 为 止 。 

@ username: 可 选 参数 ,表示 用 户 名 ,用 于 身份 验证 。 

@ password: 可 选 参数 ,表示 用 户 密码 ,用 于 身份 验证 。 

(2) void send([content]): 向 服务 器 发 出 请 求 。 如 果 请 求 声明 为 异步 的 ,这 个 方法 就 
会 立即 返回 ,否则 它 会 等 待 直到 接收 到 响应 为 止 。 可 选 参数 可 以 是 DOM 对 象 的 实例 ,输入 
流 或 串 。 传 人 这 个 方法 的 内 容 会 作为 请 求 体 的 一 部 分 发 送 。 

(3) void setRequestHeader(string header, string value) : HTTP 请 求 中 一 个 给 定 的 首 
部 设置 值 。 它 有 两 个 参数 : header 表示 要 设置 的 首部 ; value 表示 首部 的 值 。 需 要 说 明 ,这 
个 方法 在 调用 open() 之 后 才能 调用 。 

(4) void abort() : 停止 请 求 的 方法 。 

(5) string getAllResponseHeaders(): 返回 所 有 响应 的 Http 头 , 首 部 包括 Content- 
Length,Date 和 URI。 

(6) string getResponseHeader(string header) : 返回 指定 的 首部 值 。 

【 例 5-16】 设计 一 个 用 户 注册 的 页 面 ,使 用 AJAX 技术 完成 用 户 账户 的 检测 。 

分 析 : 用 户 账 户 注册 是 Web 开发 中 最 常用 的 功能 ,在 填写 表单 详细 信息 以 前 ,检测 申 
请 的 账户 是 否 存在 ,可 以 避免 提交 表单 后 ,发 现 账户 已 经 存在 而 使 得 用 户 重新 填写 。 

设 注册 页 面 ( 局 部 ) 设 计 如 图 5-16 所 示 。 


|] 间 | MA, 区 分 大 小 写 


5-16 ”设计 中 的 用 户 注册 页 面 (部 分 ) 


用 户 注册 页 面 涉 及 四 个 文档 : 四 注册 页 面 newuser-reg. htm; @@ 用 户 名 检测 页 面 
newuser-checkaccount. jsp; @@ 验 证 码 显示 createrandomcode. jsp; @ 用 户 信 息 保存 页 面 
newuser-save. jsp。 后 三 个 页 面 均 为 服务 器 页 .有关 AJAX 的 是 注册 页 面 。 相 关 代 码 如 下 。 

(1) 注册 页 面 newuser-reg. htm 代码 清单 : 

<html xmlns = "http://www. w3.org/1999/xhtml"> 

<head> 


<meta http— equiv = "Content — Type" content = "text/html; charset = gb2312" /> 
< link rel = "stylesheet" type= "text/css" href = "newuser.css" /> 


< script type = "text/javascript"> 
OANA 
function DispAccountNote( ) 
{ 
CheckResult. innerHTML = "用 户 账户 是 由 字母 ,数字 构成 , 不 能 包含 汉字 字符 "; 
} 
function DispAccountCheck() 
{ 
CheckResult. innerHTML = "<a href = '# 'onClick = 'CheckAccount (forml. useraccount)> 一 检测 
用 户 名 一 </a>"; 
} 
AAA 
function CheckAccount (obj) 
{ 
var useraccount = obj. value; 
if(useraccount == "") 
{ 
window. alert(" 用 户 账户 不 能 为 空 !"); 
obj. focus(); 
return false; 


if (escapel(forml.useraccount. value). indexOf("%u")! = —1) 
{ 

alert(" 用 户 账户 不 能 包含 汉字 ,请 重新 输入 "); 

obj. focus( ); 

return false; 


} 


// 账 户 验证 ,由 6 一 20 位 的 字母 ,数字 、 下 划 线 ,句点 、@, 组 成 ,不 能 包含 汉字 
var Expression=/^[A—-2a—-z0-9]{1}([A-2a—-z0-9]|[._@]){1,19} $ /; 
var objExp = new RegExp(Expression); 
if (objExp. test(useraccount) == false) 
{ 
alert(" 用 户 账户 由 6 一 20 位 的 字母 .数字 、 下 划 线 .点 "."、"@" 组 成 ,并 且 首 字符 为 字母 或 
数字 ."); 
obj. focus( ); 
return false; 
} 
CheckResult. innerHTML = "请 等 待 …"; 
// 初 始 化 对 象 并 发 出 XMLHttpRequest 请 求 
http_request = false; 
if (window. XMLHttpRequest) 
{ /Mozilla 或 其 他 除 王 以 外 的 浏览 器 
http_request = new XMLHttpRequest(); 
if (http_request. overrideMimeType) 
http_request. overrideMimeType("text/xml"); 
} 
else 
if (window. ActiveXObject) 
{ // 亚 浏览 器 
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try { 
http_request = new ActiveXObject("Msxml2.XMLHTTP"); 
} 
catch (e) { 
try{ 
http_request = new RctiveXObject("Microsoft. XMLHTTP" ) ; 
} 
catch (e) {} 
} 
} 
if (!http_request) 
{ 
alert(" 不 能 创建 XML HTTP 实例 !"); 
return false; 
} 
// 指 定 响应 方法 
http_request. onreadystatechange = CheckReturn; 
// 发 出 HTTP 请 求 
http_ request. open ( " GET", "newuser — checkaccount. jsp? useraccount = " + useraccount, 
true); 
http_request. send(nu11); 
} 
A 
// 处 理 服务 器 返回 的 信息 , 即 jsp 页 面 的 输出 
function CheckReturn() 
{ 
if (http_request. readyState == 4) 
{ 
if (http_request. status == 200) 
CheckResult. innerHTML = convert (http_request. responseText); 
else 
alert(http_request. status); 
} 
} 
A 
function convert (str) 
{ 
if (str! ="") 
str = str. replace(/\r/g, ""); 
return str; 
} 
MAA 
// 重 载 验证 码 
function ShowConf irmCode( obj) 
{ 
var timenow = new Date().getTime( ); 
obj. src = "createrandomcode. jsp?d= " + timenow; 
} 
</script > 
</head> 
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<body style = "margin - top:20px"> 
< form name = "forml" action = "newuser — save. jsp" method = "post" onSubmit = " return mysubmit 
9 
<table class = "info- table" cellpadding = "0" cellspacing = "0"> 
i 

<td class = "rowl" height = "30"> 

欢迎 注册 GSL5. 0 教学 过 程 管理 系统 ,有 < span class = "red">* </span > 的 必须 填写 

</td> 
</tr> 
和 
部 
<tdalign= "center"> 
<table class = "areatable" cellpadding = "0" cellspacing = "0" border = "0"> 
<tr> 

<td class = "areatitle" colspan = "3">< strong > 用 户 账户 </strong></td> 
</tr> 
<tr> 

<tdwidth="20%" class = "titlecell">< span class = "red"> * </span> 用 户 账 户 : </td> 
<tdwidth="40%" class = "inputcell"> 
< input type = "text" name = "useraccount" onfocus = "DispAccountNote()" 
onblur = "DispAccountCheck()" class = "text220"/> 


一 一 一 一 一 一 一 用 户 账户 一 一 一 一 


</td> 
<tdclass= "notecell" id = "CheckResult"> 
<a href = '# 'onClick = 'CheckAccount (forml.useraccount) > 一 检测 用 户 名 一 </a> 
</td> 
</tr> 
</table> 
</td> 


<tr> 
<tdalign= "center"> 
<table class = "areatable" cellpadding = "0" cellspacing = "0" border = "0"> 
<tr> 
<td class = "areatitle" colspan = "3">< strong > 输入 验证 码 </strong></td> 
</tr> 
<tr> 
<td width= "20%" class = "titlecell">< span class = "red"> * </span > 验证 码 : </td> 
<td width= "40%" class= "inputcel1"> 
< input type = "text" name = "confirmcode" value = "" align = "middle" class = "text80"/> 
< img src = "createrandomcode. jsp" id = "randomcode" width = "60px" height = "22px"> 
<a href = "ShowConfirmCode( document. getElementById( 'randomcode') ) "> 看 不 清 </a> 
</td> 
<td class = "notecell"> 请 输入 验证 码 , 区 分 大 小 写 </td> 
</tr> 
</table> 
</td> 
</tr> 
</table> 
</form> 
</body> 


302 


™Y 


Web 技 术 导 论 (第 3 版 ) 


</html> 
(2) 用 户 名 检测 页 面 newuser-checkaccount. jsp 代码 清单 : 


<%@ page contentType = "text/html;charset = GBK" %> 
<%@ page import = "java. sql. * "和 > 
< jsp:useBean id = "gslpub" scope = "page" class = "pub.db gslpub" /> 


<% // 接 收 客户 端 提交 的 数据 
String useraccount = request. getParameter("useraccount" ) ; 
if (useraccount == null) useraccount = ""; 
ResultSet rs = null; 
try{ 
String strSQL = " select UserAccount from useraccounts where UserAccount = '" + 
useraccount + "'™"; 
rs = gslpub. executeQuery( strSQL); 
if (rs.next()) 
out. println("< font color = '# FF0000'> 抱 菊 ! 账户 [" + useraccount + "] 已 经 被 注册 
</font >"); 
else 
out. println("< font color = '# 008800'> 祝 贺 您 ! 账户 [" + useraccount +"] 可 以 使 用 
</font >"); 
} 
catch (Exception ex){ 
out. print (ex. getMessage( ) ); 
} 
finally { 
gslpub. disconnectToDB( ); 
} 
%> 


关于 服务 端 脚 本 程序 ,请 继续 学 习 下 一 章 的 内 容 。 在 这 里 需要 说 明 的 就 是 服务 器 页 的 


输出 将 被 显示 在 客户 端 页 面 指定 的 id 区 域 。 对 于 其 他 代码 ,例如 验证 码 的 生成 代码 、 账 户 
保存 等 服务 器 代码 ,在 此 介绍 略 ,需要 的 读者 可 以 与 作者 E-mail 联系 。 


69 综合 举例 


Web 客户 端的 编程 比较 简单 , 它 不 需要 特别 的 编译 和 运行 环境 ,只 要 有 一 个 浏览 器 就 


可 以 了 。 但 是 ,要 编写 高 质量 的 客户 端 脚本 ,并 不 容易 ,这 取决 于 大 量 的 实践 经 验 ,也 来 源 于 
用 户 的 需求 。 没 有 需求 ,就 不 会 有 深入 的 编程 体验 ,更 无 法 把 一 个 工具 学 精 。 为 此 ,在 本 章 
的 最 后 ,我 们 给 出 了 三 个 在 实际 Web 开发 中 常用 的 功能 ,分 别 用 来 综合 说 明 JavaScript 中 
的 窗口 控制 .图 层 技 术 和 HTML DOM 文档 的 操作 ,帮助 建立 总 体 的 Web 客户 端 编程 


思想 。 


5.9.1 创建 折 又 式 菜单 
在 许多 网 页 上 ,都 有 折 又 式 菜单 ,这 类 菜单 的 创建 可 以 利用 HTML DOM, 通 过 纯 


第 5 章 “客户 端 纺 


程 


JavaScript 程序 编码 实现 。 目 前 常用 的 菜单 有 折 释 式 和 树 形 目录 结构 两 种 形式 。 本 节 介 绍 

折 释 式 菜单 的 创建 和 应 用 。 
设 有 一 个 框架 页 面 ,分 为 左右 两 个 frame, 左 侧 显 示 一 个 折 琶 菜单 , 右 侧 是 菜单 项 所 对 

应 的 页 面 显 示 区 域 , 右 侧 帧 名 为 mainFrame。 
折 芋 菜单 mainmenu. htm 代码 清单 : 


<html> 

<head> 

<meta http— equiv = "Content — Type" content = "text/html; charset = gb2312"> 
<style type = "text/css"> 


由 


a{color:rgb(235, 239,71);text - decoration:none; font— size:12px} 
a:hover { color: #FF0000;text — decoration:none} 
.menutitle { 


margin— left:0px; margin— top:7px;margin— bottom:Opx; 
background — color:rgb(0,119, 166); 
color:rgb(254, 254, 166); 
width:150px; height :30; 
padding:7px; 

text ~ align:center; 

font — size:13px; 

border — right:1px solid #204848; 
border - bottom: 1px solid #204848; 
border — left:1px solid # e0e0e0; 
border 一 top:1px solid # eQe0e0; 
cursor: hand; 


. submenu{ 


} 


margin— left:0px;margin ~ top:0px; margin— bottom:6px; 
background - color:rgb(0,177,234); 
color:rgb(235, 239,71); 
width:150px; 

padding:0px; 

text ~ align:center; 

line— height:200%; 

font — size:13px; 

border — right :1px solid #204848; 
border — bottom: 1px solid #204848; 
border - left:1px solid # £0f0f0; 
border - top:1px solid #f£0f0f0; 
display:none; 


</style> 
<script> 
function SwitchMenu(obj) 


{ 


var el = document. getElementById(obj); 
var ar = document. getElementById("masterdiv").getElementsByTagName( "span"); 
if (el. style.display == "block") 
el. style. display = "none"; 
else 
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{ 
for (var i=0;i<ar.length;i++) 
if (ar[i].className == "submenu") ar[i]. style. display = "none"; 
el. style. display = "block"; 
L 
} 
function DispPage(newurl) 
{ 
eval( 'parent. frames. mainFrame. location. href = newurl'); 
</script > 
</head> 
<body> 


<divalign= "center"> 
<table width = "170" height = "250" border = "0"cellspacing = "0" cellpadding = "0" bgcolor = 
"#FFFFFF"> 
党 本 
<td valign = "top" > 
<div id = "masterdiv" align = "left"> 
< div class = "menutitle" onclick = "SwitchMenu( 'sub01')"> 课 程 简介 </div> 
< span id = "sub01" class = "submenu"> 
<a href =" 井 " onclick = "DispPage( 'kcjj/kcjj. htm')"> 教 学 目标 </a><br> 
<a href =" 井 "onclick = "DispPage( 'kcjj/jxdg. htm')"> 教 学 大 纲 </a><br> 
</span> 


<div class = "menutitle" onclick = "SwitchMenu( 'sub02')"> 教 学 队伍 </div> 
< span id = "sub02" class = "submenu" > 

<a href =" 间 " onclick = "DispPage( 'jxdw/hao. htm')"> 课 程 负责 人 </a><br> 
并 ”onclick = "DispPage( 'jxdw/jxtd. htm')"> 教 学 团队 </a><br> 
间 "onclick = "DispPage( 'jxdw/rkjs. htm')"> 任 课 教师 </a>< br> 


<tr height = "10"> 
<td background = "images/bgpic004. gif"> </td> 
</tr> 
<tr height = "30"> 
<td align= "center" background = "images/bgpic004. gif"> 


< select size= "1"onChange = "if (this. value! = '—1') window. open(this. value); "> 
<option value= "一 1" selected= "selected"> 友情 链接 </option> 
<optgroup label = "校内 站 点 "> 
< option value = "http://www. sdu. edu. cn/"> 山 大 首页 </option> 
< option value = "http://gsl. sdu. edu. cn/"> 教 学 平台 </option> 
</optgroup> 
< optgroup label = "搜索 引擎 "> 
< option value = "http://www. baidu. cn/"> 百 度 搜 索 </option> 
</optgroup> 
</select > 
</td> 
</tr> 


</table> 
</div> 
</body> 
</html > 


在 浏览 器 中 打开 上 述 网 页 ,显示 创建 的 折 释 菜单 如 图 5-17 所 示 。 


文件 四 ”编辑 四 ”查看 名 收 总 和) 工具 0 帮助 人 0 
昌 慨 :日 ' 国 是 名 | 记 抽 六 中 天 如 | 侣 "总 可 "中 识 


图 5-17 折 麦 式 菜单 示例 


当 用 户 在 一 级 菜单 上 单 击 时 ,将 打开 对 应 的 二 级 菜单 。 二 级 菜单 对 应 具体 的 超 链接 , 当 
用 户 将 鼠标 指针 指向 二 级 菜单 项 目 时 ,在 浏览 器 状态 栏 中 可 以 看 到 对 应 的 超 链 接 。 根 据 需 
要 ,修改 每 一 个 二 级 菜单 项 目 对 应 的 超 链 接 ,就 可 以 很 好 地 实现 页 面 之 间 的 控制 。 


5.9.2 创建 树 形 菜单 


属性 菜单 也 是 Web 开发 中 常用 的 菜单 ,下 面 通 过 图 层 的 方式 来 演示 属性 菜单 的 创建 。 
菜单 分 为 二 级 和 三 级 菜单 ,要 实现 的 显示 界面 如 图 5-18 所 示 。 
对 应 上 述 树 形 菜单 的 menutree. htm 代码 清单 如 下 : 


日 合 新 闻 公 
<html> es 
<head> 新 闻 公告 列表 
< meta http - equiv = " Content — Type" content = " text/html; charset = |- 新 建 公告 
gb2312"> 上 修改 删除 
< style type = "text/css"> 外 名 内 容 记 术 
a {color: # 0000FF;text ~ decoration:none;font — size:14px} NE 
a:hover{color: # FF0000; text - decoration:none} i 
img{align:absmiddle} 和 入 功能 模块 管理 
.menutext01{font — size:14px; color: # 700000; vertical - align: 4px; line 功能 模块 列表 
— height:10%} 上 添加 修改 删除 
.menutext02{ font — size:14px; color: # 005000; vertical - align: 4px; line | 权限 授权 审 以 
— height:10%} 向 各 论坛 和 时 


.menutext03{ vertical ~ align:4px;} 图 5-18 树 形 菜单 
</style> 
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<script> 
OANA 
function turnit(ss, ii, bb, bott) 
{ 
bott = bott + 0; 
if (ss. style. display == "none") 
{ 
ss. style. display = ""; 
ii. src = "images/tmfopen. gif"; 
if (bott==1) 
bb. src = " images/tmminusbottom. gif"; 
else bb. src = "images/tmminus. gif"; 


else 


ss. style. display= "none"; 
ii. src = "images/tmfclosed. gif"; 
if (bott ==1) 
bb. src = " images/tmplusbottom. gif"; 
else bb. src = "images/tmplus. gif"; 


} 

</script > 

</head> 

<body style= "font - family: 宋 体 ; font - size:13px;overflow 一 x:hidden;"> 

<table width= "100 %" cellSpacing = "0" cellPadding = "0" border = "0"> 

<tr valign = 'middle' height = '16> 

<td onmouseup = 'turnit(Menu03, Img03, tag03,1);' style= 'cursor:hand;> 

< img id = 'tag03' src = 'images/tmplusbottom. gif '>< img id = 'Img03' src = 'images/tmfclosed. 
gif> 

< span class = 'menutext01 > 功能 模块 管理 </span> 

</td> 

</tr> 

<tr> 

<td id= 'Menu03' style= 'display:none> 

<table width= '100% 'border = '0'cellspacing = '0'cellpadding= '0> 

<tr height = '16> 

<td> 

< img src = 'images/tmnoline. gif >< img src = 'images/tmjoin. gif > 

< span class = 'menutext03><a href = 'modules - admin. jsp' target = 'mainFrame'> 功 能 模块 列表 
</a></span> 

</td> 

</tr> 

<tr height = '16> 

<td> 

< img src = 'images/tmnoline. gif '>< img src = 'images/tmjoin. gif > 

< span class = 'menutext03><a href = 'modules - admin. jsp' target = 'mainFrame'> 添 加 修改 删除 
</a></span> 

</td> 

</tr> 

<tr height = '16> 


<td> 

< img src = 'images/tmnoline. gif >< img src= 'images/tmjoin. gif > 

< span class = 'menutext03><a href = 'modules - admin. jsp' target = 'mainFrame'> 权 限 授 权 审 核 

</a></span> 

</td> 

</tr> 

<tr height = '16> 

<td onmouseup = 'turnit (Menu03_02, Img03_02, tag03_02,1);' style= 'cursor:hand; '> 

< img src = 'images/tmnoline. gif '>< img id= 'tag03 02' src= 'images/tmplusbottom. gif>< img id 
= 'Img03_02' src = 'images/tmfclosed. gif > 

< span class = 'menutext02 > 论坛 管理 </span> 

</td> 

</tr> 

<tr> 

<td id = 'Menu03 02' style = 'display:none> 

<table width = '100% 'border = '0'cellspacing= '0'cellpadding= '0> 

<tr height = '16'> 

<td> 

< img src = 'images/tmnoline. gif >< img src = 'images/tmnoline.gif'>< img src= 'images/tmjoin. 
gif> 

< span class = 'menutext03><a href = 'mybbs/bbsindex. jsp' target = mainFrame> 论 坛 维护 </a></ 
span> 

</td> 

</tr> 

<tr height = '16> 

<td> 

< img src = 'images/tmnoline. gif'>< img src = 'images/tmnoline. gif '>< img src = 'images/ 
tmjoinbottom. gif'> 

< span class = 'menutext03><a href = mybbs/bbsindex. jsp' target = mainFrame> 登 录 论坛 </a></ 
span> 

</td> 

</tr> 

</table> 

</td> 

</tr> 

</table> 

</td> 

</tr> 

</table> 

</body> 

</html > 


对 于 上 述 树 形 菜单 ,为 了 实现 一 级 、 二 级 、 三 级 菜单 的 显示 和 隐藏 ,使 用 了 多 重 表 格 岩 
套 , 读 起 来 非常 麻烦 ,为 什么 不 使 用 一 div 二 或 二 tbody 二 呢 ? 说 明 如 下 。 

(1) 在 表格 中 ,可 以 对 行 或 单元 格 进行 显示 和 隐藏 控制 ,如 果 要 对 多 行进 行 显示 和 隐 
藏 , 可 以 使 用 二 tbody>, 但 是 ,遗憾 的 是 二 tbody 之 不 支持 嵌 套 使 用 。 

(2) 对 于 二 div 之 和 <table> 两 者 的 联合 使 用 ,不 能 将 多 行 定义 为 一 个 <div 二 ,一 div 过 
在 表格 中 的 应 用 ,只 能 出 现在 二 td 二 中 。 

以 上 两 点 决定 了 树 形 菜 单 html 代码 只 能 使 用 二 table 二 的 嵌 套 ,如 果 一 行 是 一 级 或 二 
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级 菜单 , 它 所 包含 的 菜单 项 就 定义 在 一 个 单元 格 中 ,对 单元 格 进行 显示 和 隐藏 。 由 于 结构 相 
似 , 可 以 编写 菜单 创建 程序 ,通过 定义 菜单 数据 结构 ,自动 生成 上 述 代码 。 


5.9.3 数据 有 效 性 验证 概述 


在 Web 开发 中 ,表单 作为 客户 端 输入 数据 的 用 户 界 面 ,为 了 保证 数据 输入 的 有 效 性 ,在 
提交 表单 以 前 ,往往 需要 在 客户 端 进行 数据 的 有 效 性 检查 ,这样 可 以 有 效 地 减少 服务 器 的 负 
载 ,提高 整个 Web 系统 的 运行 效率 。 


1. 表单 的 提交 


在 HTML 中 ,表单 提交 有 以 下 两 种 方法 。 

(1) 通过 一 form 过 的 onsubmit 事件 属性 ,编写 相应 的 表单 输入 处 理 函 数 。 如 果 函 数 返 
回 true, 则 表单 提交 ; 返回 false, 则 表单 不 提交 。 使 用 该 方法 ,表单 中 需要 包含 “提交 ”按钮 ， 
即 ,type 王 "submit" 的 按钮 。 

(2) 通过 普通 按钮 或 超 链接 ,通过 定义 onclick 事件 属性 ,提交 表单 。 此 时 ,对 应 的 事件 
函数 定义 中 ,可 分 成 两 部 分 ,前 面 是 有 效 性 验证 ,然后 通过 Form 对 象 的 submit() 方 法 提交 ， 
即 : 表单 名 . submit()。 该 种 方法 和 第 一 种 方法 相 比 ,其 程序 可 读 性 更 好 。 

在 传统 的 程序 中 ,通常 会 定义 一 些 快捷 键 ,也 可 以 对 表单 提交 定义 快捷 键 。 方 法 如 下 。 

(1) 定义 键盘 操作 处 理 函 数 : 

function doByKey( ) 

! if ( window. event. keyCode == 113) //F2, 提交 表单 

formlsubmit( ); 
if (window. event. keyCode == 27) ”//Esc, 放弃 


formlcancel( ); 


} 
(2) 在 一 body 二 标记 中 ,添加 onkeydown 事件 属性 。 代 码 如 下 : 


< body onkeydown = "doByKey()"> 


2. 数据 的 有 效 性 验证 


在 表单 提交 前 ,通常 需要 验证 数据 的 有 效 性 。 验 证 数据 有 效 性 除了 采用 传统 的 程序 编 
码 外 ,采用 正则 表达 式 验 证 数据 有 效 性 的 效率 更 高 ,编程 量 较 少 。 采 用 正则 表达 式 验证 数据 
的 有 效 性 ,有 三 个 步骤 : @ 书 写 正 则 表达 式 ; @ 创 建 正 则 表达 式 对 象 ; @ 验 证 数据 。 

例如 ,要 验证 一 个 E-mail 是 否 正确 ,可 以 编写 下 面 的 代码 : 


function checkemail(str) 
{ 
// 在 JavaScript 中 ,正则 表达 式 只 能 使 用 “/” 开 头 和 结束 ,不 能 使 用 双 引 号 
var Expression=/\w+ ([— +.']\w+)x*@\Wwt+([—.]\wt)x*\.\Ww+([—.]\w+)*/; 
Var objExp = new RegExp(Expression); 
证 (objExp. test(str) == true) 
return true; 


else 
return false; 


} 

在 完成 一 种 类 型 数据 的 有 效 性 验证 的 函数 后 ,可 以 修改 表单 提交 函数 ,使 用 各 个 表单 域 
的 有 效 性 验证 函数 , 即 : 

< input type = "button" value = "确定 "onclick = "formlsubmit()"> 

表单 提交 函数 事件 onclick 对 应 的 函数 formlsubmit () 代 码 形式 如 下 : 


function formlsubmit () 
{ 
if (myform.email.value== 


{ 


"") 


alert(" 请 输入 E-mail 地 址 !"); 
myform. email. focus(); 
return false; 

} 

if (!checkemail(myform. email. value)) 

{ 
alert(" 您 输入 的 E-mail 地 址 不 正确 !"); 
myform. email. focus(); 
return false; 

} 

// 其 他 输入 域 验 证 

forml. submit( ); 

} 


当 用 户 单 击 “ 确 认 ” 按 钮 时 ,执行 用 户 定义 的 表单 检查 程序 ,检查 各 个 输入 域 数据 的 有 效 
性 ,如 果 数 据 全 部 有 效 ,最 后 执行 默认 的 表单 处 理 函 数 , 即 提交 表单 。 


5.9.4 页 面 安全 性 设置 


在 Web 开发 中 ,经 常会 对 打开 的 网 页 做 一 些 安全 性 的 设置 ,例如 禁止 用 户 复制 网 页 内 
容 、 禁 止 网 页 另存 为 、 禁 止 用 户 刷新 屏幕 .屏蔽 有 关键 盘 事件 .防止 SQL 注入 攻击 、 使 用 验证 
码 登 录 等 。 下 面 是 一 些 常见 的 页 面 安全 性 设置 。 


1. 禁止 用 户 复制 网 页 内 容 


有 时 候 可 能 不 希望 用 户 复制 网 页 内 容 ,或 将 网 页 另存 为 ,其 实现 方法 非常 简单 ,主要 是 
添加 二 body 之 标记 的 有 关 事 件 属 性 即 可 。 相 关 的 事件 属性 有 : 

(1) onselectstart ,对 象 将 要 被 选中 时 和 触发。 如 果 设 置 二 body onselectstart 一 " return 
false" 二 , 则 用 鼠标 左 键 选择 页 面 内 容 的 操作 将 被 禁止 。 

(2) oncontextmenu, 单 击 时 触发 。 

可 以 用 于 过 body 之 标记 和 许多 其 他 的 标记 ,如 果 要 禁止 在 某 个 元 素 上 碳 击 ,可 以 赋值 
false, 例 如 : 二 body oncontextmenu 一 "alert (' 快 捷 菜 单 被 禁用 ") ;self. event. returnValue 一 
false" 之 , 则 用 户 在 网 页 上 右 击 时 弹出 一 个 警告 对 话 框 ,而 不 是 原先 的 快捷 菜单 。 
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综合 上 面 的 事件 , 则 下 面 的 二 body 二 标记 属性 将 禁止 几乎 所 有 的 页 面 操作 : 


< body onmouseup = document. selection. empty() oncontextmenu = "return false" 
onselectstart = "return false" ondragstart = "return false" onbeforecopy = "return false" 
oncopy = document. selection. empty()> 


如 果 希 望 禁止 网 页 另存 为 操作 ,可 以 在 文档 体内 ,添加 下 面 的 标记 : 
< noscript>< iframe src = ""></iframe></noscript> 


当 用 户 在 浏览 器 中 选择 “另存 为 ”命令 时 ,显示 * 无 法 保存 该 网 页 ”的 错误 提示 对 话 框 。 
此 时 可 以 通过 “查看 ”>“ 查 看 源 文件 ”命令 查看 页 面 内 容 。 如 果 不 希 望 用 户 查 看 页 面 源 文 
件 , 可 以 进一步 设置 。 

上 述 事 件 属性 ,不 仅 可 以 作用 于 二 body 二 标记 ,同样 也 可 用 于 其 他 标记 中 ,例如 ,可 以 
设置 一 td 二 标记 的 oncontextmenu 事件 属性 。 


2. 禁止 用 户 屏 幕 刷新 


在 Web 开发 中 , 当 用 户 填写 表单 时 ,如 果 网 速 较 慢 ,用 户 往往 会 习惯 性 地 单 击 “ 刷 新 ” 按 
钮 ,这 将 导致 用 户 重复 提交 订单 ,从 而 产生 错误 。 此 时 ,应 该 将 浏览 器 的 菜单 屏蔽 ,这 可 以 通 
过 JavaScript 来 实现 。 下 面 通过 一 个 例子 来 讲解 其 实现 方法 。 

在 页 面 goods. htm 中 ,有 一 个 超 链接 “填写 订单 ”代码 清单 (goods. htm) 如 下 : 


<html> 
<head> 
<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312"> 
<title> 屏 项 浏览 器 主 菜单 </title> 
< script language = "javascript"> 
function deal(myurl) 
{ 
window. opener = null; 
window. close( ); 
window. open(myurl, '', "width = 580, height = 510°); 
} 
</script > 
</head> 
<body> 
<a href ="# "onClick = "deal( 'order. htm') ;"> 填 写 订单 </a></td> 
</body> 
</html > 


页 面 order. htm 为 要 打开 的 订单 页 面 。 当 单 击 “ 填 写 订单 ” 超 链接 时 ,将 打开 该 网 页 。 
3. 屏蔽 有 关键 盘 事件 


在 表单 提交 时 ,除了 不 能 够 进行 刷新 页 面 操作 外 ,通常 情况 下 ,也 不 允许 用 户 通 过 键盘 
刷新 屏幕 (F5)、 执 行 后 退 等 操作 。 要 实现 上 述 功能 ,需要 在 订单 页 面 (order. htm) 中 ,通过 
屏蔽 键盘 F5 键 、Enter 键 、 退 格 键 .Ctrl 十 N 快捷 键 等 来 完成 。 

屏蔽 键盘 的 相关 事件 代码 (order. htm) 如 下 : 


<html > 
<head> 
<meta http - equiv = "Content - Type" content = "text/html; charset = gb2312"> 
< script type = "text/javascript"> 
function mykeydown() 
{ 
if(event.keyCode == 8){ 
event. keyCode = 0; 
event. returnValue = false; 
alert(" 当 前 设置 不 允许 使 用 退 格 键 "); 
} 
if(event. keyCode == 13){ 
event. keyCode = 0; 
event. returnValue = false; 
alert(" 当 前 设置 不 允许 使 用 Enter 键 "); 
} 
if(event. keyCode == 116){ 
event. keyCode = 0; 
event. returnValue = false; 
alert(" 当 前 设置 不 允许 使 用 F5 刷新 键 "); 
} 
if ((event.altKey)&&( (window. event. keyCode == 37) | | (window. event. keyCode == 39))){ 
event. returnValue = false; 
alert(" 当 前 设置 不 允许 使 用 Alt + 方向 键 -或 方向 键 一 "); 
} 
if ((event.ctrlKey)&&(event. keyCode == 78)){ 
event. returnValue = false; 
alert(" 当 前 设置 不 允许 使 用 ctrl +N 新建 浏览 器 窗口 "); 
} 
if ( (event. shiftKey)&&(event. keyCode == 121)){ 
event. returnValue = false; 
alert(" 当 前 设置 不 允许 使 用 Shift + F10"); 
} 
} 


function click() 
{ 
event. returnValue = false; 
alert(" 当 前 设置 不 允许 使 用 右键 !"); 
} 
document. oncontextmenu = click; 
</script > 
</head> 
< body onkeydown = "mykeydown( )"> 
屏蔽 部 分 键 
</body> 
</html > 


最 后 需要 说 明 的 是 ,用 户 在 浏览 网 页 时 ,如 果 在 有 些 网 页 中 ,不 能 使 用 鼠标 拖 动 的 方法 


选中 文字 ,或 不 能 右 击 , 通 常 是 因为 网 页 中 设置 了 二 body 二 的 相关 属性 ,此 时 ,可 以 通过 设 
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置 浏览 器 关于 JavaScript 的 相关 设置 来 解决 。 具 体 方法 是 : 选择 “工具 一 “Internet 选项 ” 
命令 ; 在 打开 的 “Internet 选项 ”对 话 框 中 ,选择 “安全 ”选项 卡 , 单 击 “ 自 定义 级 别 " 按 钮 ,打开 
“安全 设置 "对话 框 ; 在 “安全 设置 "对话 框 中 ,将 “活动 脚本 ”和 java 设置 为 “禁用 ”, 来 禁止 
JavaScript 的 运行 。 然 后 按 F5 键 刷 新 网 页 。 此 时 ,网 页 中 的 内 容 就 可 以 复制 了 。 最 后 ,为 
了 保证 浏览 器 正常 工作 ,复制 完成 后 ,应 恢复 浏览 器 的 默认 设置 。 


体 章 小 结 


本 章 首先 介绍 了 程序 设计 的 基本 概念 ,目的 是 使 读者 从 思想 上 对 编程 有 一 个 基本 的 认 
识 。 然 后 讲解 了 浏览 器 的 基本 工作 原理 ,概要 介绍 了 JavaScript 程序 设计 语言 的 一 般 语 言 
要 素 , 包 括 基 本 字符 数据 与 数据 类 型 .表达 式 、. 语 句 和 函数 等 ,这 是 所 有 程序 设计 语言 都 共 
有 的 成 分 ,也 是 本 章 JavaScript 和 下 一 章 JSP 服务 器 编程 的 语言 基础 。 只 有 程序 设计 语言 
的 语句 是 不 能 编写 复杂 的 程序 的 ,还 需要 一 个 开发 环境 ,也 就 是 说 需要 特定 的 函数 库 或 类 
库 。 因 此 , 接 下 来 讲解 了 JavaScript 编程 用 到 的 标准 库 , 这 就 是 JavaScript 内 部 对 象 及 函 
数 、 浏 览 器 对 象 HTML 文档 对 象 。 最 后 ,讲解 了 Web 交互 中 表单 输入 的 数据 获取 、 数 据 
的 有 效 性 验证 ,页面 之 间 的 交互 等 大 量 的 实例 ,以 及 多 个 综合 例子 ,来 讲解 这 些 内 部 对 象 的 
功能 和 使 用 ,所 讲述 的 代码 都 来 源 于 我 们 的 研发 项 目 ,是 Web 开发 中 最 具 共 性 的 内 容 , 有 很 
好 的 实用 性 。 


句 题 5 


一 、 简 答题 

1. 如 何 理解 浏览 器 和 客户 端 脚本 引擎 之 间 的 关系 ? 

2. JavaScript 语言 有 哪 几 个 组 成 部 分 ? 简 述 各 个 部 分 的 功能 。 

3. 在 JavaScript 中 ,myArray 二 new Array(10) 是 什么 意思 ? 如 何 定义 一 个 3X4 的 二 
维 数组 ? 

4. 什么 是 网 页 对 象 ? 简 述 window 对 象 和 document 对 象 常用 的 属性 和 方法 。 

5. 画 出 HTML DOM 的 对 象 层 次 图 。 文 档 对 象 document 有 哪些 常用 的 属性 和 方法 ? 

6. 什么 是 IntelliSense 技术 ? 如 何 知道 一 个 html 标记 或 一 个 JavaScript 内 部 对 象 有 哪 
些 属 性 或 方法 ? 

7. 有 哪些 常用 的 浏览 器 事件 ?它们 是 如 何 触发 的 ? 

8. 如 何 设置 body 对 象 ,以 禁用 页 面 上 的 右键 来 防止 复制 页 面 内容 ? 

9. 如 何 设置 一 个 “关闭 窗口 ” 超 链 接 , 使 得 单 击 该 超 链接 时 ,不 弹出 询问 对 话 框 “要 关闭 
窗口 吗 ?” 

10. 什么 是 正则 表达 式 ? 写 一 个 正则 表达 式 ,实现 验证 密码 是 否 由 6 一 20 位 的 字母 , 数 
字 、 下 划 线 和 英文 句点 (. ) 组 成 的 正则 表达 式 。 

11. 对 于 表单 输入 ,编写 脚本 程序 ,完成 下 列 功 能 : 

(1) 不 提交 表单 ,检测 输入 密码 是 否 一 致 。 


(2) 通过 单 击 一 个 复 选 框 ,来 实现 一 组 复 选 框 的 全 选 或 取消 操作 。 

(3) 编写 检查 在 E-mail 输入 框 中 输入 的 E-mail 格式 是 否 正确 的 函数 。 

(4) 编写 检查 在 电话 号 码 输入 框 中 输入 的 电话 号 码 是 否 正 确 的 函数 。 

12. 在 表单 输入 中 ,默认 情况 下 , 按 Enter 键 , 则 提交 表单 ,如 何 设置 onKeyPresss 事件 
属性 ,使 得 按 Enter 键 后 ,使 输入 焦点 移 向 下 一 个 表单 元 素 ,而 不 是 提交 表单 ? 

13. 如 何在 两 个 htm 页 面 之 间 传 递 参数 ?举例 说 明 。 

14. 什么 是 网 页 对 话 框 ?” 使 用 网 页 对 话 框 ,打开 一 个 便条 输入 页 面 ,将 输入 内 容 在 父 窗 
口中 列表 显示 。 

15. 在 Web 开发 中 ,对 于 网 页 的 安全 性 ,回答 下 列 问 题 : 

(1) 要 禁止 用 户 复制 网 页 内 容 , 如 何 设置 ? 

(2) 要 禁止 用 户 执行 “另存 为 ”命令 ,如何 设置 ? 

(3) 要 禁止 屏幕 刷新 ,如 何 设置 ? 

(4) 要 屏蔽 F5 键 , 如 何 设置 ? 

(5) 在 浏览 网 页 时 ,如 果 页 面 设置 了 禁止 用 户 “ 另 存 为 ”, 如 何 复制 网 页 内 容 ? 

二 、 阅读 理解 题 

1. 阅读 下 面 的 代码 , 写 出 运行 结果 。 


<html> 
<head> 
<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312"> 
</head> 
<body> 
< select name = "sel"onchange = "document. write(document.all. sel. value);"></select> 
< script type = "text/javascript"> 
Var counts = 0; 
Var arr = new Array("text1", "text2", "text3", "text4"); 
counts = arr. length; 
for (i=0;i<counts; i++) 
{ 
document.all. sel. options[i] = new Option(arr[i], ("val" +i)); 
} 
</script > 
</body> 
</html > 


2. 说 明 下 列 函数 的 功能 。 
// 参 数 str 为 一 个 字符 串 


function convert(str) 
{ 
(ntl ="") 
{ 
str = str. replace(/\r/g, "<br>"); 
str = str. replace(/\s/g, "gnbsp;"); 
} 


return str; 
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三 、 编 程 题 

1. 编写 一 个 JavaScript 函数 ,比较 两 个 字符 串 是 否 相 等 ,如 果 相 等 ,返回 true, 和 否则 返 
回 false。 

2. 利用 div 图 层 技术 ,设计 一 个 总 是 置 于 页 面 右上 角 的 图 片 广告 , 即 当 用 户 单 击 垂直 
滚动 条 时 ,图 片 一 直 在 浏览 器 窗口 的 右上 角 。 

3. 编写 一 个 程序 ,在 客户 区 的 中 央 显 示 一 个 300X200 大 小 的 图 层 ,并 且 可 以 用 鼠标 拖 
动 图 层 。 

4. 编写 一 个 将 网 页 中 的 表格 导出 为 Excel 表 并 打印 的 程序 。 

5. 编写 一 个 利用 CSS 样式 实现 打印 页 面 指定 内 容 和 分 页 打印 功能 的 程序 。 
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【本 章 导读 】 

对 于 Web 应 用 ,大 量 的 数据 管理 工作 和 业务 逻辑 都 是 通过 服务 端 程序 实现 的 。 服 务 器 
程序 是 在 Web 服务 器 上 运行 的 ,不 同 的 Web 服务 器 ,其 编程 语言 和 开发 工具 也 不 相同 。 目 
前 ,常用 的 Web 服务 器 编程 语言 有 ASP、JSP 和 了 PHP, 它们 分 别 适 用 于 不 同 的 Web 服务 
器 。 例 如 Windows 平台 中 的 Internet 信息 服务 (IIS) ,支持 ASP 开发 。 如 果 要 使 用 JSP 开 
发 Web 应 用 , 则 需要 在 Web 服务 器 上 安装 Tomcat 应 用 服务 器 。 在 Web 应 用 的 开发 中 ， 
Java 技术 以 其 平台 无 关 性 受到 了 开发 人 员 的 欢迎 ,作为 Java 技术 的 一 种 实现 ,结合 Servlet 
和 JavaBean, 使 得 JSP 成 为 众多 Web 应 用 首选 的 开发 工具 。 

本 章 围绕 Java 技术 ,以 JSP 编程 为 例 , 详 细 介绍 Web 应 用 中 服务 器 端的 编程 问题 。 主 
要 内 容 包 括 Java 程序 设计 基础 以 及 JSP 技术 两 个 方面 。 在 Java 程序 设计 中 ,概要 性 地 介 
绍 了 Java 程序 设计 中 的 概念 ,包括 语言 基础 及 常用 的 Java 包 ,为 JSP 编程 做 好 概念 上 的 
铺垫 。 在 JSP 技术 中 ,以 任务 驱动 的 方式 ,讲解 了 服务 器 开发 中 遇 到 的 共性 问题 及 解决 办 
法 ,包括 JSP 中 的 数据 类 型 及 其 转换 、 数 组 与 集合 类 、 文 件 操 作 、JSP 内 置 对 象 、JSP 中 的 参 
数 传递 方法 以 及 JDBC 与 数据 库 编程 。 这 些 内 容 是 每 一 个 Web 应 用 中 都 可 能 遇 到 的 问 
题 ,在 讲解 中 给 出 了 许多 实用 的 代码 和 JavaBean 类 ,最 后 给 出 了 三 个 综合 案例 ,并 进行 了 
讲解 。 

【知识 要 点 】 

6.1 节 : B/S 三 层 体系 结构 服务 端 脚 本 引擎 、 服 务 端 脚本 程序 。 

6.2 节 : Java 程序 设计 语言 的 特点 、 类 的 概念 、 类 的 定义 、 封 装 、 抽 象 \ 对 象 、 构 造 函数 、 
包 、 接 口 Java 基础 类 库 Java Applet Java Servlet。 

6.3 节 : JavaBean 的 概念 。 

6.4 节 :JSP 的 运行 环境 、JSP 指令 JSP 声明 、JSP 中 的 数据 类 型 及 其 转换 、 数 组 、 JSP 
内 置 对 象 \ 在 JSP 中 使 用 JavaBean。 

6.5 节 :JDBC 接口 .JDBC 数据 库 驱 动 程序 .JDBC API\java. sql 包 、SQL 数据 库 操作 。 

6.6 节 : 文件 上 传 .表单 数据 处 理 、 页 面 间 的 数据 传递 。 

6.7 节 : Web 系统 分 析 \、 功 能 设计 、 数 据 库 设计 、 界 面 设计 、 使 用 AJAX。 

6.8 节 : Web 系统 开发 环境 的 概念 .JDK 开发 环境 简介 、NetBeans 开发 环境 简介 、 
Eclipse 开发 环境 简介 。 
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6.1 B/S 三 层 体系 结构 与 Web 服务 器 脚本 程序 


服务 端 脚本 程序 是 指 在 Web 服务 器 上 运行 的 程序 。 在 B/S 模式 下 , 当 用 户 下 载 一 个 
网 页 时 ,如 果 网 页 中 包含 服务 端 脚本 程序 , Web 服务 器 将 调用 服务 端 脚本 程序 引擎 (如 
Tomcat 应 用 服务 器 ) 执 行 网 页 中 的 脚本 程序 ,然后 把 执行 的 结果 网 页 发 送 到 客户 端 浏 览 器 
显示 。 


6.1.1 B/S 三 层 体系 结构 


在 Internet 环境 ,客户 机 /服务 器 (C/S) 两 层 体系 结构 表现 出 了 许多 局 限 性 , 它 需要 在 
企业 局 域 网 内 运行 ,缺少 可 伸缩 性 ,客户 端 维 护 复 杂 
人 客户 端 浏 览 器 ” 等 。 为 此 ,出 现 了 基于 Web 的 浏览 器 /服务 器 (B/S) 
三 层 体系 结构 (3-tier)。 这 种 体系 结构 大 致 可 以 定义 
Se 和 为 客户 机 上 的 表示 层 、 中 间 的 Web 服务 器 层 和 后 端 
SO 的 | we 服务器。 的 数据 库 服 务 器 层 。B/S 三 层 体系 结构 如 图 6-1 
所 示 。 
天 提 放 天 地 所 上 | 数据库 服 务 器 在 B/S 三 层 体系 结构 模式 下 ,客户 端 不 再 需要 
上 安装 特定 的 客户 端 应 用 程序 ,取而代之 的 是 通用 的 
图 6-1 B/S 三 层 结构 的 分 层 功 能 界定 ”Web 浏览 器 软件 ,所 有 的 用 户 业 务 罗 辑 都 被 部 署 在 
新 的 中 间 层 上 。 新 的 中 间 层 往往 是 一 组 公共 网 关 接 
口 (Common Gateway Interface,CGI) 程 序 ,CGI 程序 充当 一 种 中 间 软 件 , 从 Web 浏览 器 接 
收 请 求 ,决定 必须 调用 哪些 计算 资源 来 满足 这 些 请 求 ,并 向 浏览 器 发 回响 应 。 传 统 的 CGI 
程序 一 般 是 由 CVC++ 开 发 的 , 随 着 Java Servlet 的 出 现 ,CGI 的 功能 更 多 地 是 由 Java Servlet 
来 实现 , 它 具 有 更 高 的 效率 和 可 移植 性 。 
由 于 三 层 体系 结构 通常 是 基于 Web 的 ,因此 中 间 层 应 用 程序 通常 工作 在 Web 服务 器 
上 ,被 视 为 Web 服务 器 的 一 种 功能 扩展 ,因此 中 间 层 又 称 为 Web 服务 器 层 。 在 Web 服务 
器 上 ,通过 大 量 的 包含 CGI/Servlet 的 服务 器 脚本 程序 页 面 ,接收 来 自 客户 端 浏览 器 的 请 
求 , 以 及 完成 对 数据 库 的 操作 。 


6.1.2 脚本 引擎 与 服务 端 脚本 程序 


什么 是 脚本 引擎 呢 ? 简单 地 讲 , 脚 本 引擎 就 是 指 脚本 程序 的 运行 环境 ,负责 脚本 程序 的 
解释 ,来 具体 处 理 用 相应 脚本 语言 书写 的 脚本 命令 。 例 如 ASP 脚本 语言 必须 运行 在 IIS 
上 ; Tomcat 是 JSP 和 Servlet 的 容器 ,运行 JSP 网 页 必须 安装 和 配置 Tomcat。 没 有 脚本 引 
擎 ,脚本 程序 将 不 能 运行 。 
在 ASP 结构 中 ,ASP 解释 器 (ASP. DLL) 负 责 ASP 页 内 服务 器 端 脚本 程序 的 解析 任 
务 。 这 需要 安装 相应 脚本 程序 语言 的 脚本 引擎 , 即 脚本 程序 解释 器 ,来 具体 处 理 用 相应 语言 
写 的 脚本 命令 ,它们 以 COM 组件 的 形式 供 ASP 解释 器 调用 。Active Server Pages 带 有 
两 个 脚本 引擎 Microsoft Visual Basic Scripting Edition (VBScript) 和 Microsoft 
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JScript, 其 中 ASP 中 的 默认 语言 是 VBScript。 在 Windows 平台 上 , Internet 信息 服务 器 
IIS 内 售 Active Server Pages, 安 装 IIS 后 .VBScript 和 JScript 脚本 引擎 会 自动 地 安装 在 服 
务 器 上 。 

如 果 要 使 用 其 他 的 脚本 程序 语言 ,例如 JSP, 则 必须 在 Web 服务 器 上 安装 相应 的 脚本 
引擎 , 即 Tomcat 应 用 服务 器 。 脚 本 引擎 遵循 ActiveX 脚本 标准 并 作为 一 个 COM( 组 件 对 
象 模型 ) 对 象 驻 留 在 Web 服务 器 上 。 

在 Web 服务 器 上 安装 服务 端 脚本 引擎 后 ,进行 简单 的 配置 ,然后 就 可 以 在 网 页 中 编写 
服务 端 脚本 程序 了 。 与 客户 端 脚本 程序 书写 在 过 script 之 过 /script 之 标记 对 内 不 同 ,服务 端 
脚本 程序 一 般 书 写 在 定 界 符 “ 二 %” 和 “% 二 ”内 。 

【 例 6-1】 服务 器 页 面 与 JSP 程序 的 运行 示例 。 

分 析 : 服务 端 脚本 程序 通常 被 书写 在 服务 器 页 中 ,例如 JSP(Java Server Page)、ASP 
(Active Server Page) 等 。 当 用 户 要 浏览 服务 器 页 时 ,Web 服务 器 将 调用 相应 的 应 用 服务 器 
执行 服务 器 页 中 包含 的 服务 器 脚本 程序 ,最 后 将 执行 结果 返回 给 用 户 浏览 器 。 

一 个 包含 服务 端 脚本 程序 的 网 页 (test, jsp) ,代码 清单 如 下 : 

<% @ page contentType = "text/html;charset = gb2312" %> 

<%! 

String datestr = ""; 

%> 

<html> 

<body> 

<% 

java. util. Date nowdate = new java.util.Date(); 

java. text. DateFormat df = new java. text.SimpleDateFormat("yyyy— MM- dd HH:mm"); 

datestr = df.format(nowdate); 

datestr = datestr. substring(0, 16); 

第 > 

现在 的 时 间 是 : <% = datestr %> 

</body> 

</html > 


这 是 一 个 典型 的 JSP 文 件 , 可 以 看 出 , 它 是 Java 程序 和 HTML 标记 的 混合 体 。 看 起 来 
比较 乱 ,需要 一 个 习惯 的 过 程 。 此 外 ,由 于 程序 代码 和 HTML 标记 混在 一 起 ,需要 注意 格 
式 , 特 别 是 空格 ,否则 也 会 产生 运行 错误 。 例 如 : 二 % 二 datestr% 二 ,“ 二 %” 和 “二 ”之 间 不 
能 有 空格 ,有 的 用 户 习 惯 加 一 个 空格 ,使 格式 看 起 来 美观 ,但 却 会 产生 错误 。 通 过 浏览 器 下 
载 该 页 面 时 ,Web 服务 器 将 执行 其 中 的 服务 端 脚本 程序 ,在 客户 端 浏览 器 中 显示 执行 后 的 
结果 。 

要 运行 JSP 页面, 必须 要 安装 Tomcat 并 进行 相应 的 配置 ,详细 内 容 请 见 第 2 章 。 为 本 
章 示例 程序 说 明 的 方便 ,在 Tomcat 主 配置 文件 \conf\ server. xml 中 创建 虚拟 目录 , 即 : 
二 Context path 一 "/book" docBase 王 "d:\haobook" /二 ,本 章 所 有 的 要 调试 的 JSP 页 面 ,如 
果 没 有 特别 说 明 , 均 保存 在 d:\haobook 文件 夹 中 。 要 运行 上 述 页 面 ,在 浏览 器 地 址 栏 中 输 
入 http://127.0.0.1/book/test. jsp ,运行 结果 如 图 6-2 所 示 。 

选择 浏览 器 的 “查看 ”一 “ 源 文件 ”命令 ,可 以 看 到 服务 器 页 传送 到 客户 端的 HTML 代 
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码 , 本 例 中 JSP 页 面 生成 的 html 代码 如 下 : 


< html > 
<body> 
现在 的 时 间 是 : 2012- 01- 28 16:30 
</body> 
</html > 


如 果 JSP 页 面 中 还 包含 客户 端 脚本 程序 ,用 户 可 以 通过 客户 端 脚本 程序 ,对 服务 器 上 
生成 的 数据 进行 操作 ,来 完成 功能 强大 的 Web 页 面 编 程 。 


文件 四 编辑 四 查看 WW 收 丫 由 工具 上 帮助 0 
回 恨 - 旧 - 国 因 信 | 记 拉 语 收 如 | 个 " 闻 问 * 
梧 


现在 的 时 间 是 ，2012-01-28 16:30 


TTT OT 


图 6-2 JSP 页 面 运行 结果 示例 


6.2 Java 程序 设计 基础 


Java 程序 设计 语言 是 Java 技术 的 重要 组 成 部 分 ,Java 技术 是 Sun 公司 于 1995 年 推出 
的 一 种 极 富 创造 力 的 计算 平台 。Java 技术 的 多 功能 性 有 效 性 .平台 无 关 性 以 及 安全 性 使 
它 成 为 网 络 计算 领域 最 完美 的 技术 ,给 未 来 的 计算 模式 产生 了 革命 性 的 影响 ,是 继 HTML 
后 ,Internet 发 展 的 又 一 个 里 程 碑 。 今 天 ,Java 技术 已 经 无 处 不 在 ,从 桌面 PC 到 科学 超级 
计算 机 和 互联 网 ,从 移动 电话 到 移动 手持 设备 ,从 家 庭 游戏 机 到 信用 卡 ,几乎 在 所 有 的 网 络 
和 设备 上 都 会 看 到 Java 技术 的 身影 。 


6.2.1 Java 程序 设计 语言 


Java 程序 设计 语言 是 Sun 公司 于 20 世纪 90 年 代 初 开始 研发 的 ,总 设计 师 为 James 
Gosling。Java 程序 设计 语言 和 C/C++ 等 一 般 的 程序 设计 语言 类 似 , 都 包含 基本 符号 、 数 据 、 
数据 类 型 .表达 式 流程 控制 .类 与 对 象 等 程序 设计 的 概念 。 

在 Java 中 ,基本 的 语言 元 素 ,包括 基本 符号 、 数 据 、 数 据 类 型 .表达 式 、 流 程控 制 ,与 
C/C++ 等 程序 设计 语言 类 似 , 也 和 JavaScript 的 语法 类 似 。 下 面 是 Java 语言 不 同 于 C++ 的 
一 些 特有 性 质 。 
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(1) Java 没有 主 函 数 和 全 局 函数 。C++ 并 非 完 全 意义 上 的 面向 对 象 语言 ,最 明显 的 例 
子 是 ,在 C++ 中 ,必须 有 一 个 独立 的 主 函 数 (在 DOS 和 UNIX 下 是 main() ,在 Windows 下 
是 WinMain()), 还 可 以 定义 可 以 直接 使 用 的 大 量 的 全 局 函数 或 者 使 用 C++ 中 的 命名 空间 
“extern C” 来 使 用 原 有 的 C 过 程 调用 。 

Java 是 完全 面向 对 象 的 语言 , 它 没有 主 函 数 等 完全 孤立 的 东西 ,任何 函数 都 必须 隶属 
于 一 个 类 。 当 然 ,任何 程序 都 有 一 个 人 口 ,Java 程序 也 有 主 入 口 函数 ,名 称 同样 是 main()， 
但 它 必须 包含 在 一 个 类 中 。 一 般 形式 是 : 

public class AppName{ 

public static void main(String args[ ]) 
// 代码 
} 

} 

(2) Java 没有 全 局 变量 。 在 Java 程序 中 ,不 能 在 类 外 面 定义 全 局 变量 ,只 能 通过 在 一 
个 类 中 定义 公用 静态 变量 来 实现 全 局 变量 。 例 如 : 

class GlobalVar { 

public static GlobalVarName; 。 // 全 局 变量 定义 

} 

因为 public static 成 员 是 一 种 类 属 成 员 变量 ,只 要 定义 了 类 ,其 中 的 类 属 成 员 变 量 就 分 
配 空间 ,而 不 需要 必须 声明 类 的 对 象 ,使 得 其 他 类 可 以 访问 和 操作 该 变量 。 

可 见 ,在 Java 中 ,对 全 局 变量 进行 了 更 好 的 封装 。 而 在 C++ 中 ,不 依赖 于 任何 类 的 不 加 
封装 的 全 局 变量 往往 会 导致 系统 崩溃 。 

(3) Java 没有 结构 和 联合 。 在 C++ 中 ,为 了 保持 和 C 的 兼容 ,继续 支持 结构 (struct) 和 
联合 (union)。 但 是 ,在 Java 中 , 则 完全 按 弃 了 这 些 面 向 过 程 时 代 的 概念 。 

(4) 字符 串 不 再 是 字符 数组 。 在 C 和 C++ 中 ,字符 串 操 作 往往 会 导致 许多 内 存 问题 ,如 
内 存 非法 操作 、 内 存 泄漏 等 。 因 为 字符 串 char * s 和 不 定 界 的 字符 数组 char s[ 是 等 价 的 。 
但 两 者 只 是 为 变量 s 分 配 一 个 指向 字符 串 的 指针 ,存储 字符 串 内 容 的 内 存 需要 申请 和 释放 。 

在 Java 中 ,字符 串 和 字符 数组 已 经 被 分 开 了 。 字 符 串 是 一 个 完全 意义 上 的 对 象 ,需要 
用 String 类 来 定义 。 

(5) Java 用 包 (Package) 来 分 解 命名 空间 。 在 大 型 的 软件 工程 中 ,怎样 保证 程序 员 之 间 
命名 的 类 不 重 名 ,以 及 如 何 避 免 供应 商 提供 的 类 和 程序 员 自 己 命名 的 类 不 重 名 呢 ? 虽然 有 
许多 方法 可 以 避免 重 名 ,但 是 如 果 在 发 现 问题 以 前 ,工程 已 经 启动 了 ,要 修改 这 些 重 名 问题 ， 
就 变 得 非常 麻烦 。 

在 Java 中 ,引入 Package 概念 来 解决 上 述 问 题 。Package 有 效 地 通过 集合 类 来 划分 命 
名 空间 ,在 不 同 包 内 的 类 可 以 同名 ,但 不 会 引起 混乱 。 

Java 并 没有 彻底 解决 命名 冲突 的 问题 ,扩展 基 类 可 能 引起 派生 类 的 冲突 。 例 如 : 用 户 
派生 一 个 类 ,增加 一 个 方法 foo。 如 果 以 后 供应 商 提 供 新 的 版 本 ,在 新 类 中 也 包含 了 foo 方 
法 ,冲突 就 出 现 了 。 

(6) Java 没有 独立 的 头 文件 。 在 C++ 中 ,每 一 个 . cpp 实现 文件 都 对 应 一 个 . h 头 文件 ， 
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在 头 文件 中 ,往往 包含 了 . cpp 文件 中 用 到 的 类 的 定义 。 在 Java 中 ,关于 类 的 一 切 东 西 (属性 
和 方法 ) 都 被 放 到 一 个 单独 的 文件 中 ,类 中 方法 的 实现 必须 在 定义 的 过 程 中 同时 进行 。 

因为 类 方法 的 实现 代码 必须 在 方法 定义 时 完成 ,但 是 一 个 函数 往往 是 几 十 行 或 者 几 百 
行 的 程序 代码 ,这样 就 使 得 阅读 类 很 难 一 下 子 就 看 到 一 个 类 的 全 貌 。Java 的 设计 者 已 经 考 
虑 到 了 这 个 问题 ,为 此 ,在 JDK 中 提供 了 两 个 工具 来 补偿 : Javap 来 打印 类 标识 ,Javadoc 为 
源 代 码 提供 标准 的 HTML 文档 。 

(7) 数据 类 型 。 在 C/C++ 中 ,对 于 不 同 的 平台 ,编译 器 对 简单 数据 类 型 int float 等 分 配 
不 同 长 度 的 内 存 空间 ,例如 int 在 IBM PC 中 为 16b, 在 VAX-11 中 为 32b, 这 导致 了 代码 的 
不 可 移植 性 。 但 是 在 Java 中 ,对 于 这 些 基本 数据 类 型 ,总 是 分 配 固定 长 度 的 空间 ,int 总 是 
32b, 这 就 可 以 保证 Java 的 平台 无 关 性 。 

在 C/C++ 中 通过 指针 可 以 进行 强制 类 型 转换 ,这 往往 会 带 来 不 安全 性 。 在 Java 中 ,有 
严格 的 类 型 相 容 性 检查 。 另 外 ,在 Java 中 ,没有 模板 类 ,而 C++ 中 的 模板 类 (参数 化 类 , 即 形 
式 参 数 对 应 的 实际 参数 是 数据 类 型 ) 可 以 有 效 地 简化 程序 代码 的 编写 ,但 不 能 减少 可 执行 代 
码 的 长 度 。 这 就 意味 着 ,在 Java 中 ,只 能 靠 相似 代码 的 手工 复制 和 修改 。 

(8) 常量 修饰 符 const 的 使 用 限制 。 在 C++ 中 ,const 常量 修饰 符 有 着 重要 的 应 用 , 它 对 
于 提高 代码 质量 起 到 了 积极 的 作用 。 例 如 ,用 户 可 以 声明 函数 参数 或 者 函数 的 返回 值 为 
const 类 型 ,这 样 可 以 有 效 地 防止 在 函数 内 部 对 函数 参数 的 不 正当 修改 或 者 对 返回 值 的 修 
改 。 另 外 ,可 以 将 类 的 一 个 成 员 函 数 声明 为 const, 表 明 该 方法 不 能 修改 它 操作 的 任何 对 象 。 

在 Java 中 ,支持 常量 操作 符 、 只 读 变量 ,通过 final 关键 字 实 现 。 但 是 ,Java 没有 提供 一 
种 机 制 , 使 得 一 个 变量 在 参数 传递 或 者 返回 的 过 程 中 只 读 , 或 者 定义 一 个 不 能 修改 操作 对 象 
的 常量 方法 。 上 述 的 省 略 ,为 Java 程序 带 来 了 一 个 可 能 引起 不 正当 修改 错误 的 隐患 。 

另外 ,在 Java 中 , 宏 也 不 再 被 支持 。 


6.2.2 类 与 对 象 


在 20 世纪 90 年 代 以 前 , 自 顶 向 下 逐步 求 精 的 结构 化 程序 设计 是 软件 开发 的 主要 方法 ， 
直到 现在 ,这 种 结构 化 的 程序 设计 思想 仍然 被 广泛 地 采用 。Pascal、C、BASIC、FORTRAN 
等 高 级 语言 很 好 地 实现 了 结构 化 编程 的 思想 ,通过 过 程 和 函数 (又 称 子 程序 ) ,把 一 个 复杂 的 
问题 分 解 成 若干 个 相对 简单 的 子 问 题 , 如 果子 问题 还 比较 复杂 ,再 继续 划分 ,最 后 将 划分 后 
的 每 个 问题 用 过 程 和 函数 来 实现 。 

20 世纪 90 年 代 以 后 ,面向 对 象 技术 使 人 们 近 半 个 世纪 来 的 软件 开发 思想 产生 深刻 的 
变革 。 这 一 技术 强调 利用 软件 对 象 进行 软件 开发 , 它 将 自然 界 中 的 物理 对 象 和 软件 对 象 相 
对 应 ,建立 了 类 和 对 象 的 概念 。 由 于 客观 世界 的 实体 和 软件 结构 的 对 象 一 一 对 应 ,从 而 增加 
了 软件 系统 的 可 扩展 性 和 可 维护 性 。 面 向 对 象 技术 将 自然 界 中 的 物理 对 象 和 软件 对 象 对 应 
起 来 ,在 传统 的 数据 结构 基础 上 加 入 了 成 员 函 数 (方法 ) 的 概念 ,从 而 赋予 对 象 以 动作 。 


1. 类 与 对 象 的 概念 


类 (class) 是 包含 数据 和 处 理 这 些 数 据 的 过 程 的 数据 结构 。 可 以 将 类 看 成 和 int float 
等 基本 数据 类 型 一 样 的 数据 类 型 ,用 它 来 创建 数据 对 象 , 它 指定 了 相应 内 存 区 域 的 处 理 和 解 
释 规 则 。 
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对 象 (object) 是 用 类 来 声明 的 数据 结构 ,如 果 将 类 比 作 数据 类 型 ,对 象 就 是 相应 数据 类 
型 的 变量 。 对 象 是 类 的 实例 ,占据 确定 的 内 存 空 间 。 


2. 类 的 定义 


在 Java 中 ,用 户 可 以 定义 一 个 基 类 ,也 可 以 从 别 的 类 进行 派生 (extends) ,或 者 通过 实 
现 (implements) 一 个 或 多 个 接口 来 定义 一 个 新 的 类 。 类 定义 的 一 般 形 式 是 : 
[类 型 修饰 符 ] class < 类 名 > [extends < 父 类 名 >] [implements < 接口 名 列表 >] 
{ 
成 员 变量 声明 ; 
成 员 函 数 定义 ; 
} 


其 中 ,类 型 修饰 符 决定 类 的 类 型 ,有 四 种 。 

(1) abstract, 抽 象 类 ,必须 包含 至 少 一 个 抽象 成 员 函 数 。 抽 象 类 不 能 够 创建 对 象 , 需 要 
用 其 派生 类 创建 。 例 如 ,可 以 定义 一 个 图 形 类 CFigure, 将 其 定义 为 抽象 类 ,然后 从 其 派生 
具体 的 图 形 类 ,例如 三 角形 类 CTringle、 和 矩形 类 CRectangle 等 。 

(2) public, 公 有 类 ,能 被 其 他 类 访问 的 公有 类 ,在 其 他 包 (package) 中 要 使 用 该 类 ,需要 
先 用 import 导入 ,否则 只 能 在 它 定 义 的 package 中 使 用 。 

(3) final, 最 终 类 ,说 明 一 个 类 不 能 再 派生 子 类 。 

(4) synchronicable, 表 示 所 有 类 的 成 员 函 数 都 是 同步 的 。 

上 述 修 饰 符 可 以 同时 出 现 两 个 或 以 上 ,但 修饰 符 abstract 和 final 不 能 同时 使 用 。 

class 为 关键 字 , 表 明 接 下 来 是 类 的 定义 ,类 名 是 一 个 用 户 自 定义 的 标识 符 。 

如 果 是 派生 类 ,需要 通过 extends 给 出 父 类 ,如 果实 现 接口 (interface), 需 要 通过 
implents 给 出 接口 名 ,接口 可 以 是 一 个 或 多 个 。 

花 括号 内 说 明 类 的 成 员 变 量 和 成 员 函 数 ,又 称 类 的 属性 (attribute) 和 方法 (method) 。 

(1) 声明 成 员 变 量 。 成 员 变 量 定义 的 一 般 形式 是 : 

[访问 级 别 修饰 符 ] < 类 型 > < 成 员 变量 列表 >; 


其 中 ,访问 级 别 修饰 符 为 类 成 员 声 明 访 问 级 别 . 可 以 是 private、public、protected。 还 可 
以 添加 的 修饰 符 有 final( 最 终 , 初 始 化 后 不 能 再 改变 其 值 的 变量 ) volatile( 多 线程 变量 )。 
这 些 访 问 级 别 可 以 按 任何 顺序 出 现 ,也 可 以 多 次 出 现 。 在 两 个 访问 级 别 声明 符号 之 间 的 成 
员 具 有 相同 的 访问 控制 级 别 。 

如 果 成 员 变量 包含 修饰 符 static, 此 变量 称 为 类 变量 ,不 加 static 的 变量 称 为 对 象 变量 。 
如 果 变 量 说 明 时 缺 省 修饰 符 , 则 它 可 被 同一 包 中 的 所 有 类 访问 。 

(2) 定义 成 员 函 数 。 成 员 函 数 又 称 类 的 方法 (method) ,是 类 中 定义 的 可 对 类 进行 操作 
的 函数 模块 。 成 员 函 数 定义 的 一 般 形式 为 : 

[访问 级 别 修饰 符 ] 返回 值 类 型 < 方法 名 >( [形式 参数 列表 ] ) [throws 异常 列表 ] 

{ 


// 函数 体 (Java 程序 代码 ) 
} 
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其 中 修饰 符 可 以 是 private、public、protected 和 final( 最 终 , 不 能 由 子 类 改变 的 方法 )、 
abstract( 抽 象 方法 ,无 方法 体 ) .synchronized( 线 程 同步 的 方法 ) ,native( 本 机 方法 ) 。 修 饰 符 
可 以 有 一 个 或 多 个 。 另 外 ,还 可 以 有 static 来 声明 静态 成 员 函 数 ,表明 此 方法 为 类 方法 ,无 
static 修饰 的 方法 为 对 象 方法 。 

“形式 参数 列表 ?给 出 函数 的 形式 参数 及 类 型 , 形 参 之 间 用 逗号 分 隔 。 当 所 定义 的 方法 
没有 形 参 时 圆 括号 内 为 空 。 


3. 封装 和 抽象 


在 面向 对 象 技 术 中 ,一 个 主要 的 目标 就 是 对 象 的 封装 和 抽象 。 封 装 (Encapsulation) 是 
指 对 象 可 以 拥有 私有 元 素 , 将 内 部 细节 隐藏 起 来 的 能 力 。 封 装 将 对 象 封闭 起 来 ,管理 着 对 象 
的 内 部 状态 。 而 抽象 则 和 对 象 的 外 部 状态 紧密 相关 , 它 通 常用 来 描述 对 象 所 表示 的 具体 概 
念 、 对 象 所 完成 的 任务 以 及 处 理 对 象 的 外 部 接口 。 抽 象 处 理 的 是 对 象 的 可 见 外 部 特征 。 

在 C 中 ,通过 关键 词 static 可 以 实现 有 限 的 封装 。 当 一 个 变量 在 一 个 函数 内 部 被 说 明 
成 static 形式 时 ,该 变量 就 只 在 函数 中 存在 ,并 且 只 在 函数 内 部 有 效 。 男 外 ,一 个 全 程 变 量 
被 说 明成 static 形式 时 ,该 变量 只 在 其 所 在 的 文件 有 效 , 这 样 可 以 避免 不 同 的 文件 中 全 局 变 
量 的 重 名 。 

在 C++ 和 Java 等 面向 对 象 的 程序 设计 语言 中 ,类 的 每 一 个 成 员 都 被 说 成 public .private 
和 protected 型 ,用 这 些 关键 词 来 实现 数据 的 抽象 和 封装 。 

(1) 关键 词 public。 类 中 所 有 public 成 员 构 成 类 的 接口 ,它们 是 类 的 抽象 性 的 表现 。 
出 于 简单 ,经济 和 安全 的 愿望 ,理论 上 讲 , 类 的 公开 元 素 越 少 越 好 。 但 是 ,类 又 必须 和 外 部 打 
交道 ,public 成 员 是 不 可 缺少 的 。 

(2) 关键 词 private。 类 中 的 private 成 员 只 能 被 类 的 成 员 函 数 、 友 元 类 或 外 部 友 元 函数 
访问 ,从 而 实现 类 的 封装 性 。 在 默认 状态 下 ,所 有 的 成 员 都 是 私有 的 。 

(3) 关键 词 protected。 在 面向 对 象 技 术 中 ,派生 是 类 的 重要 性 质 。 类 的 private 成 员 将 
不 能 被 派生 类 中 的 成 员 访 问 ,这 就 大 大 限制 了 类 的 灵活 性 。 类 的 protected 成 员 可 以 被 类 的 
派生 类 成 员 访 问 。 

类 成 员 访 问 规则 如 图 6-3 所 示 。 


可 以 访问 的 有 : 


类 成 员 函 数 
private 友 元 类 成 员 函 数 
友 元 函数 


所 有 可 访问 private 的 函数 
派生 类 成 员 函 数 
所 有 函数 


6-3 ”类 成 员 访 问 规则 


4. 静态 成 员 


支持 封装 和 抽象 的 另外 机 制 还 包括 关键 词 static。 当 一 个 成 员 被 说 明成 static 时 , 则 该 
成 员 在 程序 中 只 有 一 个 副本 存在 ,而 不 是 在 每 个 对 象 中 都 有 一 个 副本 。 所 有 的 对 象 共享 类 
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中 的 静态 成 员 。 在 一 些 面 向 对 象 的 程序 设计 语言 中 ,静态 成 员 被 称 为 类 变量 ,或 类 属 变量 。 
例如 ,定义 一 个 含有 静态 成 员 变 量 的 类 如 下 : 
class CS { 
static int a; 
int b,c,d; 
}; 
Cs objs[3]; 
在 类 CS 中 ,包含 四 个 成 员 变量 ,其 中 成 员 变 量 a 为 静态 成 a | 
员 变 量 。 数 组 objs 包含 三 个 CS 类 对 象 ,由 于 CS 类 包含 一 个 静 ”objs[0] 
态 成 员 变量 a, 因 此 三 个 CS 对 象 共享 一 个 静态 成 员 变量 a, 每 个 
对 象 都 包含 自己 的 普通 成 员 变 量 b,c,d, 如 图 6-4 所 示 。 objs[1] 
还 可 以 把 一 个 成 员 函 数 说 明 为 static, 这 意味 着 在 没有 任何 
该 类 对 象 的 情况 下 , 它 仍然 可 以 被 执行 。 正 因 如 此 ,静态 成 员 函 ”objs[2] 
数 能 够 完成 不 需要 任何 对 象 成 员 变 量 的 操作 。 静 态 成 员 变量 和 
静态 成 员 函 数 为 类 存储 和 管理 属于 整个 类 而 不 是 个 别 对 象 的 信 图 6-4 类 CS 的 成 员 
息 提供 了 一 种 方法 。 


aoclaoclaoc 


5. 构造 函数 


在 面向 对 象 技 术 中 ,对象 是 类 的 实例 ,每 个 对 象 必 须 按照 类 的 定义 来 创建 ,这 种 机 制 是 
通过 类 的 构造 函数 来 实现 的 。 构 造 函 数 (constructor) 是 一 种 特殊 的 成 员 函 数 ,用 来 在 内 存 
中 建立 具体 的 对 象 。 构 造 函 数 必须 申请 必要 的 内 存 空间 ,将 内 存 转化 为 具体 的 对 象 ,初始 化 
成 员 变 量 等 。 构 造 函 数 的 名 称 和 类 名 称 相同 ,一 个 类 可 以 拥有 几 个 带 有 不 同 参 数 的 构造 函 
数 。 构 造 函 数 没有 返回 类 型 和 返回 值 。 

和 一 般 的 函数 不 同 ,构造 函数 不 是 由 用 户 显 式 调用 (call) 的 , 它 是 通过 编译 器 来 调用 的 ， 
称 为 激活 (invoke)。 当 通过 new 创建 一 个 类 的 对 象 时 ,相应 的 构造 函数 则 被 激活 ,来 完成 内 
存 对 象 的 初始 化 操作 等 。 

在 使 用 构造 函数 时 ,需要 注意 以 下 若干 情况 。 

(1) 构造 函数 不 能 描述 为 const 和 volatile。 

(2) 构造 函数 不 能 是 static, 因 为 构造 函数 需要 初始 化 类 的 成 员 变 量 ,但 静态 构造 函数 
不 能 访问 成 员 变 量 。 

(3) 构造 函数 不 能 被 继承 。 当 一 个 没有 构造 函数 的 类 从 一 个 含有 构造 函数 的 类 派生 
时 ,将 写 它 自己 的 构造 函数 。 

(4) 构造 函数 不 能 有 返回 值 ,也 不 可 以 是 void。 

(5) 定义 一 个 类 时 ,必须 明确 定义 除 缺 省 构造 函数 和 拷贝 构造 函数 以 外 的 所 有 其 他 构 
造 函 数 。 缺 省 构造 函数 是 不 含有 参数 的 构造 函数 ,可 以 省 略 不 写 。 


6. 类 的 继承 性 与 派生 类 


从 现存 的 对 象 出 发 建立 一 种 新 的 对 象 类 型 ,使 它 继承 原 对 象 的 特点 和 功能 ,这 就 是 对 象 
的 继承 性 。 继 承 是 许多 层次 对 象 的 自然 描述 。 从 现存 类 派生 出 新 类 时 ,现存 类 称 为 基 类 
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(base class) ,派生 出 的 新 类 称 为 派生 类 。 派 生 类 可 以 对 基 类 作 如 下 变化 。 

(1) 增加 新 的 成 员 变量 。 

(2) 增加 新 的 成 员 函 数 。 

(3) 重新 定义 已 有 的 成 员 函 数 , 即 ; 子 类 可 以 对 父 类 的 方法 进行 覆盖 (overriding) 或 重 
载 (overloading) 。 所 谓 覆 盖 ,是 指 在 子 类 中 定义 了 与 父 类 中 同名 的 函数 ,这 时 将 根据 当前 的 
对 象 类 型 执行 子 类 中 的 代码 , 即 父 类 中 的 代码 被 覆盖 。 所 谓 方法 重 载 是 类 中 含有 同名 ,但 特 
征 参 数 (参数 数量 .参数 类 型 ) 不 同 的 方法 ,编译 时 通过 形式 参数 确定 要 调用 的 方法 。 

覆盖 或 重 载 反 映 了 面向 对 象 中 函数 的 多 态 性 , 重 载 是 一 种 编译 时 多 态 技术 ,因为 程序 在 
编译 时 可 以 根据 特征 参数 决定 要 连接 哪个 同名 函数 。 覆 盖 则 是 一 种 运行 时 多 态 , 因 为 ,具体 
运行 基 类 还 是 子 类 的 函数 是 根据 运行 时 对 象 所 属 的 类 决定 的 ,因此 是 一 种 运行 时 多 态 。 

(4) 改变 现 有 成 员 函 数 的 属性 。 

派生 类 不 能 删除 基 类 的 成 员 变量 和 成 员 函 数 , 实 际 上 派生 类 往往 是 基 类 的 扩充 ,是 一 种 
具体 化 和 完善 的 过 程 。 

类 的 派生 创建 了 一 个 类 族 ,派生 类 的 对 象 也 是 基 类 的 一 个 对 象 , 它 可 用 在 基 类 对 象 可 被 
使 用 的 任何 地 方 。 可 用 多 态 成 员 函 数 来 调整 这 种 关系 ,以 使 得 派生 类 在 某 些 地 方 和 它 的 基 
类 一 致 ,而 在 另外 一 些 方面 表现 出 其 自身 的 行为 特征 。 

类 的 派生 是 一 种 演化 过 程 , 即 通过 扩展 、 更 改 和 特殊 化 ,从 一 个 已 知 类 出 发 来 建立 一 个 
新 的 类 。 类 的 派生 建立 了 一 个 具有 共同 关键 特性 的 类 族 ,从 而 实现 代码 的 重用 。 假 设 从 一 
个 已 知 基 类 A 建立 一 个 派生 类 B, 一 般 形式 为 : 

class B extends A 

{ 


// 派生 类 B 的 成 员 说 明 

}; 

读 作 “ 类 B 由 A 派生 ”, 它 告诉 编译 器 类 B 是 一 种 A, 对 基 类 A 所 作 的 修改 和 添加 在 括 
号 内 给 出 。 在 派生 类 对 象 中 ,编译 器 在 内 存 中 总 是 先 放 入 基 类 的 成 员 , 后 面 是 派生 类 独 有 的 
成 员 ,如 图 6-5 所 示 。 

对 于 一 个 派生 类 ,对 于 其 父 类 中 的 成 员 , 有 特定 的 成 员 的 访问 规则 , 见 表 6-1。 

表 6-1 基 类 和 派生 类 中 成 员 的 访问 特性 


基 类 成 员 基 类 class A{ … } 派生 类 class B extends A{ … } 
派生 类 private 成 员 不 可 访问 
特有 成 员 protected 成 员 保护 
public 成 员 公有 
图 6-5 派生 类 对 象 内 存 结构 不 可 访问 成 员 不 可 访问 


所 谓 不 可 访问 成 员 ,是 一 个 派生 类 中 的 概念 。 一 个 根 类 (不 是 从 其 他 类 派生 出 来 的 类 ) 
中 不 存在 不 可 访问 的 成 员 。 但 是 在 派生 类 中 ,不 可 访问 是 存在 的 ,如 根 类 中 的 private 成 员 ， 
就 构成 派生 类 的 不 可 访问 成 员 。 如 果 再 从 派生 类 派生 新 的 类 , 则 派生 类 的 不 可 访问 成 员 和 
私有 成 员 就 构成 了 它 的 派生 类 的 不 可 访问 成 员 , 依 此 类 推 。 

最 后 ,需要 说 明 的 是 ,在 调试 Java 程序 时 ,经 常 是 编译 通过 了 ,但 运行 时 出 现下 列 错误 
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提示 : Exception in thread "main” java. lang. NoSuchMethodError: main。 产 生 上 述 错 误 
的 原因 比较 复杂 ,可 以 从 以 下 两 个 方面 进行 排查 。 

(1) 每 个 Java 文件 有 且 只 能 有 一 个 公有 类 , 即 public 类 ,文件 名 必须 和 这 个 公有 类 的 
类 名 大 小 写 完 全 一 样 。 在 要 运行 的 类 中 有 且 只 能 有 一 个 public static void main(String[] 
args) 方 法 ,这 个 方法 就 是 主 程序 。 运 行 一 个 Java 程序 ,应 该 是 在 java 命令 后 跟 包含 main 
函数 的 类 名 ,而 不 是 Java 程序 的 文件 名 , 即 java 去 包含 main 方法 的 java 类 二 ,类 名 后 面 不 
能 有 . class 等 扩展 名 。 

(2) 如 果 在 编译 或 运行 时 出 现 问题 ,还 可 能 是 类 的 路 径 问 题 。 我 们 来 看 一 下 Java 程序 
的 运行 过 程 ,首先 通过 javac 命令 ,将 Java 程序 编译 生成 . class 文件 , 即 虚拟 机 要 执行 的 代 
码 , 称 之 为 字 节 码 (bytecode)。 然 后 ,通过 java 命令 , 即 通 过 Java 虚拟 机 来 解释 运行 class 
文件 。 虚 拟 机 通过 classloader 来 装载 这 些 字 节 码 , 即 通常 意义 上 的 类 。 问 题 是 ,classloader 
从 哪里 知道 Java 本 身 的 类 库 及 用 户 自 己 的 类 在 什么 地 方 呢 ? 要 解决 这 个 问题 ,通常 是 通过 
系统 环境 变量 中 的 类 路 径 (classpath) 来 设置 的 。 

因此 , 当 出 现 编译 或 运行 错误 时 ,还 应 该 检查 类 路 径 设置 是 否 正 确 。 具 体 方 法 是 ,在 
DOS 提示 符 下 输入 set classpath, 即 可 显示 当前 的 路 径 设 置 ,应 该 包含 一 个 当前 路 径 项 目 ， 
即 “.”, 其 次 就 是 Java 的 安装 路 径 。 


7. 创建 对 象 


当 定 义 类 后 ,创建 对 象 有 两 种 方法 ,一 种 是 静态 的 声明 ,例如 : CTest myObj; 则 创建 一 
个 CTest 类 的 对 象 myObj。 此 外 ,还 可 使 用 new 来 动态 地 创建 对 象 , 一 般 形式 是 : 


对 象 变量 = new 类 (参数 ); 


如 果 类 的 构造 函数 带 有 参数 ,可 以 通过 new 中 类 名 后 面 的 参数 ,来 激活 相应 的 构造 函 
数 ,来 实现 对 类 成 员 的 初始 化 。 如 果 是 一 个 派生 类 ,还 涉及 基 类 成 员 的 初始 化 问题 。 


8. Java 程序 与 main() 方 法 


所 有 的 程序 都 应 该 有 一 个 主 程序 , 它 是 程序 开始 执行 的 入 口 。 在 Java 程序 中 ,通常 定 
义 多 个 类 ,但 只 能 有 一 个 public 类。 在 这 些 类 中 必须 有 一 个 类 包含 main() 方 法 ,如 果 包 含 
main 方法 的 类 是 公有 类 (用 public 修饰 的 类 ) ,那么 文件 名 必须 是 这 个 类 的 类 名 ,如 果 main 
方法 所 在 的 类 没有 用 public 修饰 ,那么 文件 名 可 以 任意 命名 ,不 一 定 要 和 任何 类 名 一 样 。 

【 例 6-2】 定义 一 个 三 角形 图 形 类 CTriangle, 定 义 相 应 的 属性 和 方法 ,并 在 DOS 模式 
下 对 文件 进行 编译 和 运行 。 

分 析 : 定义 了 一 个 三 角形 图 形 类 CTriangle, 包 含 三 个 私有 成 员 变 量 , 存 储 三 角形 的 三 
条 边 ,一 个 构造 函数 ,一 个 计算 三 角形 面积 的 成 员 函 数 和 一 个 输出 成 员 函 数 。 

代码 清单 : Exa6-02. java 

class CTriangle 

' private double a, b,c,t; 


public double s= 0; 
CTriangle( double x, double y, double z) 
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{ 
a=x; b=y; c=2; 
} 
// 计 算 三 角形 的 面积 
public double Area() 
{ 
t= (at+b+c)/2; 
s= Math.sqrt(t* (t—a)*(t—-b)*(t—c)); 
return s; 
} 
public void out1() 
{ 
Area( ); 
System. out. println("Area= "+ s); 
} 
class MyTest01 
{ 
public static void main(String[ ] args) 
{ 
CTriangle myobj = new CTriangle(10,20,15); 
myobj. out1(); 
} 
} 


在 DOS 提示 符 下 ,执行 javac Exa6-02. java 命令 ,编译 ,生成 每 个 类 的 . class 文件 , 即 
CTriangle. class 和 MyTest01. c Java 程序 是 在 JVM 上 运行 的 ,在 DOS 提示 符 命令 状 


态 下 ,执行 java MyTest01, 运 行 上 述 程序 , 输 果 如 图 6-6 所 示 


不 命令 提示 符 


C:\Documents and Settin 
D:\>cd haobook 


D:\haobook>javac Exa6-2.java 


950 Clriangle.c 
494 Exa6-2.java 


二 4 
23.916.519,424 可 用 字 节 


D: \haobook>java MyTest@1 
Area=72.61843774138987 


D: \haobook> 
图 6-6 Java 程序 的 编译 和 运行 
【 例 6-3】〗 编写 程序 ,验证 类 构造 函数 的 激活 顺序 


分 析 : 在 类 的 定义 中 ,都 包含 相应 的 构造 函数 ,这 些 构造 函数 的 激活 顺序 不 同 ,在 下 面 
的 例子 中 ,定义 三 个 类 A、B、C, 其 中 C 中 包含 两 个 对 象 成 员 , 来 展示 对 象 构造 函数 的 激活 
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次 序 。 
代码 清单 : Exa6-02. java。 


classA{ 
int x,y; 
A(int a, int b) 
! 


x=a; y=b; 
} 
A() // 默 认 构造 函数 
{ 
半生 相生 
System. out. println("R constructor\n"); 
} 
} 
classB{ 
B() 
{ 
System. out. println("B constructor\n"); 
- 
} 
classC{ 


public Aa=new A(); 
public B b= new B(); 
C() 

{ 


System. out. println("C constructor\n"); 
} 
} 


class MyTest02 
{ 
public static void main(String[ ] args) 
{ 
Cmy0bj = new C(); 
} 
} 


执行 java MyTest02 ,输出 结果 为 : 


A constructor 
B constructor 
C constructor 


上 述 输出 结果 表明 ,如 果 一 个 类 含有 成 员 对 象 , 则 在 创建 类 的 对 象 时 ,将 先 创建 类 的 成 
员 对 象 ,最 后 才 是 类 的 对 象 本 身 。 


6.2.3 接口 
在 一 个 复杂 的 面向 对 象 的 系统 中 ,实现 一 个 有 更 多 方法 的 新 类 是 经 常 遇 到 的 。 当 一 个 
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类 需要 从 多 个 基 类 派生 时 ,派生 类 将 继承 多 个 基 类 的 特征 ,在 C++ 中 ,这 样 的 机 制 称 为 多 重 
继承 。 在 面向 对 象 的 程序 设计 中 ,继承 关系 一 直 存 在 很 多 的 争议 ,特别 是 多 重 继承 。 


1. 接口 和 类 


Java 没有 多 重 继 承 , 可 以 通过 接口 来 实现 相应 的 功能 。 在 Java 中 ,所 谓 接口 
(Interface) 是 一 组 没有 给 出 实现 细节 的 操作 (方法 ) 的 集合 。 它 需要 别 的 类 来 实现 接口 给 出 
的 每 一 个 方法 ,一 个 类 可 以 实现 一 个 或 多 个 接口 。 如 果 一 个 类 实现 了 某 个 接口 ,就 相当 于 声 
明 我 能 够 完成 某 项 工作 。 在 许多 情况 下 ,类 的 实现 接口 继承 (implements 关系 ) 比 类 的 扩展 
基 类 继承 (extends 关系 ) 更 有 优势 。 

接口 的 定义 和 类 的 定义 类 似 , 但 是 接口 不 是 一 个 类 ,而 是 对 符合 接口 要 求 的 类 的 一 套 规 
范 。 接 口 说 明了 实现 接口 的 类 该 做 什么 而 不 指定 如 何 去 做 ,一 个 类 可 以 实现 一 个 或 多 个 
接口 。 

实现 一 个 接口 需要 两 个 步骤。 

(1) 声明 类 需要 实现 的 接口 。 声 明 一 个 类 实现 一 个 接口 需要 使 用 implements 关键 字 。 

(2) 提供 接口 中 的 所 有 方法 的 定义 。 为 了 使 用 接口 ,需要 编写 执行 接口 的 类 。 一 个 类 
实现 了 某 个 接口 , 即 这 个 类 实现 了 在 接口 中 声明 的 所 有 方法 ,就 相当 于 声明 我 能 够 完成 某 项 
工作 。 

实现 接口 的 类 继承 了 定义 在 接口 中 的 常量 ,这 些 类 可 以 使 用 简单 的 名 字 来 引用 接口 定 
义 中 的 常量 。 


2. 接口 的 定义 和 扩展 


在 Java 中 ,可 以 定义 一 个 接口 ,也 可 以 从 一 个 接口 或 多 个 接口 来 扩展 一 个 接口 ,这 和 类 
的 定义 类 似 。 接 口 定义 的 一 般 形 式 是 : 

public interface < Interfacename > [extends < Superinterface 列表 >] 

成 员 变 量 声明 (常量 ); 

成 员 函 数 (方法 ) 声 明 ; 

在 接口 定义 中 ,public 指示 了 接口 可 以 被 任何 包 中 的 任何 类 使 用 。 如 果 没 有 指定 接口 
为 public, 那 么 接口 就 只 能 在 定义 接口 的 包 中 的 类 中 使 用 。 一 个 接口 可 以 扩展 另外 的 接口 ， 
这 跟 类 可 以 扩展 一 样 。 但 是 ,类 只 能 扩展 一 个 另外 的 类 ,而 接口 可 以 扩展 任意 个 接口 。 
Superinterface 列表 列 出 所 有 的 被 扩展 的 接口 ,以 逗号 分 隔 。 

接口 可 以 包含 常量 声明 以 及 方法 声明 。 所 有 定义 在 接口 中 的 常量 可 以 是 public 、static 
和 final。 定 义 在 接口 中 的 成 员 变 量 不 能 使 用 transient volatile 或 者 synchronized 修饰 符 。 
同样 也 不 能 在 声明 接口 的 成 员 的 时 候 使 用 private 和 protected 修饰 符 。 

接口 中 的 方法 声明 后 紧 跟着 一 个 分 号 ,因为 接口 中 的 方法 不 需要 给 出 具体 的 实现 代码 。 
因此 ,所 有 定义 在 接口 中 的 方法 可 以 隐 含 地 为 public abstact 方法 。 


6.2.4 包 
在 Java 中 ,为 了 管理 大 型 名 字 空 间 , 避 免 名 字 冲 突 , 引 入 包 (Package) 的 概念 。 包 是 由 
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一 组 类 和 接口 构成 。 一 般 情况 下 ,每 一 个 类 或 接口 都 被 存储 在 不 同 的 文件 中 ,为 了 管理 和 使 
用 方便 ,对 于 那些 相关 的 类 和 接口 可 以 绑 定 到 一 个 包 中 。 例 如 ,Java 的 基本 类 在 java. lang 
中 ,而 用 于 输入 、 输 出 以 及 文件 ( 夹 ) 操 作 的 类 则 在 java. io 中 。 

Java 中 的 包 其 实 指 的 就 是 目录 , 它 可 以 更 好 地 管理 Java 类 (Class) 和 接口 (Interface) 。 
使 用 包 就 定义 了 一 个 类 和 接口 的 名 字 空 间 ,一 个 包 中 的 类 和 接口 的 名 字 与 其 他 包 中 的 名 字 
不 会 冲突 。 同 时 ,还 可 以 约束 包 内 的 类 和 外 部 的 类 的 访问 权限 。 


1. 定义 包 


使 用 package 语句 可 以 将 一 个 编译 单元 ( 源 程序 文件 ) 定 义 成 包 。 如 果 使 用 package 语 
句 ,编译 单元 的 第 一 行 必须 无 空格 ,也 无 注释 。 格 式 如 下 : 

package < 包 名 >; 

若 编译 单元 无 package 语句 , 则 该 单元 被 置 于 一 个 默认 的 无 名 的 包 中 。 

按照 一 般 的 习惯 , 包 名 是 由 “. "号 分 隔 的 单词 构成 ,第 一 个 单词 通常 是 开发 这 个 包 的 组 
织 的 名 称 。 

例如 ,有 一 个 Java 文件 ,文件 名 为 B.java, 内 容 如 下 : 

package hao. yy; 

public class B{ 


B(int yy, int mm, int dd) 
{ 


System. out. println("Year:" +yy+ "Month:" +mm + "Date" + dd); 
} 

} 

执行 javac -d d:\B.java 命令 ,其 中 参数 -d 二 目录 二 为 指定 输出 文件 的 目录 。 因 此 ， 
上 述 编译 命令 执行 后 将 在 “d:\ "目录 下 ,创建 一 个 d:\hao\yy 文件 夹 , 该 文件 夹 中 包含 了 编 
译 后 的 类 文件 B. class。 

现在 这 个 包 已 经 创建 好 了 ,要 使 用 这 个 包 中 的 类 B, 需 要 导入 ,或 者 把 d:\hao\yy 设置 
在 环境 变量 classpath 中 。 


2. 使 用 包 中 的 类 和 接口 


要 使 用 定义 在 一 个 包 中 的 类 和 接口 ,可 以 通过 import 关键 词 ,主要 有 两 种 形式 。 
(1) 使 用 import 语句 ,导入 类 或 接口 ,或 包含 它们 的 包 。 导 入 的 类 和 接口 的 名 字 在 当 
前 的 名 字 空 间 可 用 。 导 入 一 个 包 时 , 则 该 包 中 的 所 有 的 公有 类 和 接口 均 可 用 。 形 式 如 下 : 


import < 包 名 .[* | 类 名 | 接口 名 >; 


其 中 ,“* ”表示 导入 包 中 的 所 有 类 。 如 果 仅 仅 要 使 用 包 中 一 个 类 ,可 指定 类 或 包 的 名 
字 。 例 如 : 使 用 util 包 的 Date 类 ,可 以 写作 “import java. util. Date;”, 下 面 是 一 个 有 关 日 期 
处 理 的 类 的 定义 ,程序 获取 当前 的 系统 时 钟 ,并 按 MM-dd-yyyy 格式 输出 日 期 。 代 码 如 下 : 


import java. util. Date; 
import java. text. SimpleDate; 
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public class mydate 
{ 
public static void main(String[ ] args) { 

// Create a date formatter that can parse dates of the form MM— dd— yyyy 
SimpleDateFormat bartDateFormat = new SimpleDateFormat("MM— dd— yyyy"); 
// Create a string containing a text date to be parsed 
String dd = "6— 22— 2008"; 
Date date = bartDateFormat. parse(dd); 
// Send the parsed date as a long value to the system output 
System. out. println(date. getTime( )); 


’ 

(2) 在 每 个 引用 的 类 和 接口 前 面 给 出 它们 所 在 的 包 的 名 字 。 一 般 形式 是 : 
包 名 .< 类 名 | 接口 名 > obj = new 包 名 .< 类 名 | 接口 名 >( 参 数 表 ); 

例如 ,要 使 用 上 面 定义 的 包 hao. yy 中 包含 的 类 ,语句 为 : 

hao. yy fd = new hao. yy.B(2003,11,24); 


在 使 用 一 个 外 部 类 或 接口 时 ,要 声明 该 类 或 接口 所 在 的 包 , 否 则 会 产生 编译 错误 。 此 
外 ,要 确保 这 些 类 和 包 的 路 径 正 确 , 即 需 要 包含 在 classpath 环境 变量 中 ,否则 编译 器 在 编译 
时 将 找 不 到 所 需要 的 类 。 


6.2.5 Java 基础 类 库 


对 于 所 有 的 程序 设计 语言 ,都 可 以 分 成 两 个 部 分 ,第 一 部 分 就 是 语言 本 身 , 包 括 语言 的 
字符 集 、 数 据 、 类 型 .程序 语句 、 函 数 等 语法 部 分 ; 第 二 部 分 则 是 开发 程序 用 的 标准 库 , 里 面 
包含 了 大 量 的 标准 函数 或 标准 类 ,是 软件 开发 的 API(Application Program Interface) , 它 可 
以 帮助 开发 者 方便 ,快捷 地 开发 相应 语言 的 程序 。 

在 Java 编程 中 ,Java 语言 提供 了 大 量 的 已 经 实现 的 标准 类 ,这 些 类 的 集合 构成 Java 的 
类 库 。 这 些 类 根据 实现 的 功能 不 同 ,划分 为 不 同 的 集合 ,每 个 集合 组 成 一 个 包 。jJava 类 库 
大 部 分 都 是 由 Sun 公司 提供 的 ,这 些 类 库 称 为 Java 基础 类 库 。Java 的 类 库 日 益 庞大 ,所 包 
含 的 类 和 接口 众多 ,用 户 是 无 法 全 部 掌握 的 。 但 是 ,了 解 类 库 的 组 成 可 以 帮助 开发 者 更 方便 
地 找到 需要 的 类 ,节省 大 量 的 编程 时 间 , 使 编写 的 程序 更 简单 。Java 中 丰富 的 类 库 资 源 也 
是 Java 语言 的 一 大 特色 ,是 Java 程序 设计 的 基础 。 下 面 简要 介绍 Java 类 库 中 的 核心 部 分 ， 
即 那些 包含 最 重要 、 最 常用 的 类 和 接口 的 包 。 


1. java.lang 包 


java. lang 包 又 称 Java 语言 包 , 主 要 含有 与 语言 相关 的 类 。 定 义 了 Java 中 的 大 部 分 基 
本 类 ,包含 Java 语言 类 、 线 程 . 异常 .系统 .Object 类 以 及 各 种 数据 类 型 等 相关 的 类 。java. 
lang 包 是 Java 程序 中 默认 加 载 的 一 个 包 , 由 解释 程序 自动 加 载 , 不 需要 显 式 说 明 。 


2. java.util 包 


java. util 包 , 又 称 Java 实用 程序 包 。Java 平台 中 有 两 个 最 常用 的 基础 包 ,一 个 是 java. 
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lang 包 , 男 一 个 就 是 java. util 包 。java. util 包 包含 了 大 量 的 公用 类 ,包括 常用 的 数学 运算 
类 、 字 符 串 类 日 期 .日 历 类 以 及 向 量 哈 希 表 等 类 ,还 包括 一 些 接口 和 异常 类 。 


3. java.awt 包 


Java 抽象 窗口 工具 (Abstract Windowing Toolkit) 包 java. awt 包含 一 些 GUI 界面 相关 
的 类 ,包括 窗口 对话 框 、 菜 单 、 各 种 控件 等 。awt 类 库 还 包含 一 组 用 来 处 理 绘图 .打印 功能 ， 
并 且 支 持 易 用 性 、 拖 放 和 二 维 图 形 的 API。 通 过 这 些 元 素 ,编程 者 可 以 控制 所 写 的 Applet 
或 应 用 程序 的 外 观 界面 。 

通过 awt 可 以 创建 与 平台 无 关 、 基 于 图 形 用 户 界面 的 程序 。 同 微软 的 Windows API 相 
比 ,清楚 ,简单 和 强大 的 awt 是 Java 语言 迅速 流行 的 重要 原因 。awt 不 仅 是 编写 Windows 
程序 的 良好 工具 ,而 且 可 以 编写 其 他 操作 系统 平台 的 图 形 界面 应 用 程序 。 


4. java.swing 包 


新 的 图 形 界面 类 库 java. swing 继承 awt, 提 供 了 多 种 图 形 界面 组 件 ,swing 中 包含 了 像 
标签 页 、 表 格 、 树 、 特 殊 边 框 微 调 等 各 种 新 组 件 。 这 些 组 件 都 是 100% 纯 Java 的 ,不 依赖 具 
体 的 Windows 系统 ,可 以 在 各 种 平台 上 实现 。swing 中 支持 可 插入 观感 (Pluggable Look 
and Feel, PL&F) ,支持 用 户 定制 桌面 .更换 新 的 颜色 方案 ,让 窗口 系统 适应 特定 的 用 户 习惯 
和 需要 。swing PL&F 体系 结构 使 得 同时 定制 swing 控件 或 控件 组 更 加 容易 。 


5. java.io 包 


输入 输出 包 java. io, 提 供 了 全 面 的 1/O 接口 ,包括 文件 读 写 、 标 准 设备 输出 等 。 它 是 以 
流 为 基础 进行 输入 输出 的 ,所 有 数据 被 串 行 化 写 人 输出 流 , 或 者 从 输入 流 读 入 。1/O 体系 分 
Input/Output 和 Reader/ Writer 两 类 ,区 别 在 于 Reader/Writer 在 读 写 文本 时 能 自动 转换 
内 码 。 流 1/O 的 好 处 是 简单 易 用 ,缺点 是 效率 较 低 。 

Java 也 对 块 传输 提供 支持 ,在 核心 库 java. nio 中 采用 的 便 是 块 IO, 块 I/O 效率 很 高 ， 
但 编程 比较 复杂 。 


6. java.applet 包 


java. applet 包 中 定义 了 设计 小 应 用 程序 (Applet) 的 类 和 接口 ,包括 控制 HTML 文档 
格式 .应 用 程序 中 的 声音 等 资源 的 类 。 例 如 Applet 类 、AppletContext 接口 .AppletStub 接 
口 .AudioClip 接口 等 ,其 中 Applet 是 创建 包含 于 HTML 的 Applet 必 不 可 少 的 。 


7. java.beans 包 


JavaBeans 是 Java 应 用 程序 环境 的 中 性 平台 组 件 结构 。java. beans 包 定 义 了 应 用 程序 
编程 接口 (APD ,包含 与 开发 JavaBeans 有 关 的 类 和 接口 。 


8. java.net 包 


java. net 包 包 含有 与 网 络 操作 相关 的 类 ,如 TCP Sockets、URL 等 工具 ,该 包 支 持 
TCP/IP, 并 包含 Socket 类 、URL .与 URL 相关 的 类 。 
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6.2.6 Java Servlet 服务 器 程序 


在 一 台 Web 服务 器 控制 下 ,运行 若干 小 型 用 户 程序 ,这 就 是 公共 网 关 接口 (CGI) 程序 
(又 称 CGI 脚本 ?所 起 的 作用 。CGI 应 用 程序 本 身 往往 不 是 完整 的 应 用 程序 ,在 处 理 接收 自 
Web 浏览 器 上 用 户 的 信息 请 求 时 .CGI 只 是 整个 处 理 过 程 中 的 一 个 中 间 步 又 。 例 如 ,CGI 
应 用 程序 的 一 种 常见 用 途 是 访问 数据 库 。 将 它 用 于 这 种 任务 时 ,CGI 程序 提供 一 种 方法 ,将 
用 户 的 数据 请 求 连接 到 能 满足 这 种 请 求 的 企业 数据 库 。CGI 程序 常常 充当 一 种 中 间 软 件 ， 
从 Web 浏览 器 接收 请 求 ,决定 必须 调用 哪些 计算 资源 来 满足 这 些 请 求 ,并 向 浏览 器 发 回响 
应 。 传 统 的 CGI 程序 一 般 是 由 C 或 C++ 开发 的 ,这 些 语言 的 执行 速度 较 快 。 随 着 优化 编译 
器 的 引入 ,用 Java 来 实现 中 间 层 成 为 可 能 。 

Servlet 是 专门 为 在 Web 服务 器 上 运行 而 设计 的 Java 程序 ,与 CGI 程序 一 样 ,用 于 充 
当 连 接 前 端 Web 请 求 与 后 端 数据 资源 的 中 间 层 组 件 。 它 可 以 动态 地 扩展 服务 器 的 能 力 , 并 
采用 请 求 -响应 模式 提供 Web 服务 。 使 用 Java Servlet 可 以 以 更 高 的 效率 和 可 移植 性 来 实 
现 CGI 的 目的 ,并 最 终 会 取代 传统 的 CGI 程序 。 

现在 ,在 Web 开发 中 ,传统 的 CGI 编程 正在 被 Servlet 技术 所 替代 。Java Servlet 的 出 
现 , 为 应 用 程序 员 使 用 Java 来 创建 Web 应 用 程序 开辟 了 新 的 途径 。 但 是 ,Servlet 只 是 工作 
在 Web 服务 器 上 的 一 个 连接 客户 请 求 和 数据 库 系 统 的 中 间 层 , 它 不 是 一 个 可 以 独立 运行 的 
Java 程序 , 它 不 能 在 操作 系统 下 直接 运行 ,必须 运行 在 Servlet 容器 中 。 

单独 编写 Servlet 非常 麻烦 , 随 着 JSP 技术 的 发 展 ,可 以 直接 将 Java 代码 写 在 HTML 
页 面 中 ,这 些 代码 被 包含 在 “二 %” 和 “% 放 ”内 ,形成 JSP 文件 。 对 于 JSP 页 面 中 的 代码 ,将 
被 编译 成 Servlet, 这 样 就 大 大 地 减少 了 Servlet 开发 的 难度 。 


(6.3 JavaBean 


在 软件 开发 中 ,软件 组 件 技术 的 思路 就 是 把 软件 功能 开发 为 一 个 个 的 组 件 ,将 不 同 的 组 
件 组 装 成 一 个 应 用 程序 ,而 JavaBean 组 件 是 软件 组 件 技术 的 一 种 Java 实现 。 在 Web 应 用 
开发 中 ,JavaBean 通常 用 做 中 间 ”* 商 业 逻 辑 ? 层 ,用 于 将 表示 逮 辑 和 数据 访问 多 辑 隔离 ,许多 
业务 逻辑 通常 被 编码 成 JavaBean , 而 不 是 直接 写 在 JSP 页 面 中 。 由 于 CGI/Servlet 的 复杂 
性 ,目前 JavaBean 和 JSP 技术 已 经 成 为 Web 应 用 服务 器 三 层 结构 中 的 中 间 层 业务 多 辑 开 
发 的 主要 工具 。 


6.3.1 JavaBean 的 概念 


简单 地 讲 ,JavaBean 是 一 种 Java 类 。 任 何 具有 某 种 特性 和 事件 接口 约定 的 Java 类 都 
可 以 写成 一 个 JavaBean。 通 过 将 一 个 满足 某 些 准则 的 Java 类 写成 JavaBean, 通 常用 于 JSP 
页 面 中 ,以 便于 实施 软件 的 重用 。 

理论 上 讲 , 虽 然 JavaBean 没有 严格 的 规范 ,通常 情况 下 ,一 个 JavaBean 是 一 个 Java 类 ， 
这 样 的 Java 类 将 对 应 于 一 个 独立 的 . java 文件 ,在 绝 大 多 数 情况 下 , 它 是 一 个 public 类 型 的 
类 。 作 为 一 个 类 , 它 具 有 类 的 一 般 特征 ,例如 属性 方法 等 。 


第 6 章 “服务 端 编程 


1. 属性 


JavaBean 提供 了 高 层 的 属性 (Properities) 概念 。 从 面向 对 象 的 角度 看 ,属性 就 是 传统 
的 对 象 属性 (Attribute) 。JavaBean 属性 描述 了 bean 的 内 部 状态 ,是 JavaBean 中 的 数据 部 
分 ,属性 的 值 可 以 通过 适当 的 方法 进行 读 写 。JavaBean 有 四 种 类 型 的 属性 ,分 别 是 单 值 属 
性 、 索 引 属 性 、 关 联 属性 和 限制 属性 。 

1) 单 值 属性 

单 值 属性 是 JavaBean 中 最 简单 的 属性 ,只 需要 定义 一 个 包含 一 个 值 的 数据 成 员 , 并 为 
其 定义 一 对 设置 (set) /获取 (get) 属 性 的 方法 ,以 便于 外 部 与 其 发 生 联 系 。 如 果 没 有 为 单 值 
属性 提供 设置 器 (set) 方 法 , 则 该 属性 为 只 读 型 属性 ; 如 果 没 有 为 单 值 属性 提供 获取 器 (get) 
方法 , 则 该 属性 为 只 写 属性 。 

单 值 属性 设置 器 /获取 器 定义 的 一 般 形式 是 : 


public void set < PropertyName >(< PropertyType > propertyValue) // 属性 设置 器 


public <PropertyType > get < PropertyName >() // 属性 获取 器 
每 一 个 单 值 属性 都 有 一 组 set 和 get 方法 用 于 给 属性 赋值 或 获取 该 属性 的 值 。 
2) 索引 属性 


索引 属性 类 似 于 Java 中 的 数组 ,包括 若干 个 数据 类 型 相同 的 元 素 ,可 以 通过 整数 索引 
值 访 问 其 中 的 属性 ,因此 称 为 索引 属性 。 

3) 关联 属性 

JavaBean API 除 了 支持 单 值 属性 和 索引 属性 外 ,还 提供 了 一 些 属 性 用 于 增强 JavaBean 
的 属性 管理 功能 。 如 关联 属性 , 当 修改 这 类 属性 时 ,将 发 送 一 个 通知 给 其 他 元 素 ( 如 
Applet、Application 或 其 他 JavaBean) ,如 果 与 该 JavaBean 中 的 某 个 属性 相关 联 , 就 会 注册 
该 属性 。 因 此 ,只 要 这 个 关联 属性 发 生变 化 ,就 会 有 一 个 通知 发 送 给 这 些 相 关 部 件 ,这 些 属 
性 称 为 关联 属性 ,它们 的 值 发 生 改 变 与 外 部 部 件 有 关 , 外 部 部 件 称 为 监听 器 。 

一 个 有 关联 属性 的 JavaBean 需要 支持 如 下 一 对 事件 监听 器 的 注册 方法 : 

public void addPropertyChangeListner(PropertyChangeListner1) 

public void removePropertyChangeListner(PropertyChangeListner1) 

4) 限制 属性 

JavaBean API 中 的 另 一 种 高 级 属性 类 型 是 限制 (Constrained) 属 性 , 它 可 以 使 外 部 部 件 
在 接受 属性 的 修改 值 之 前 先 确认 修改 值 。 也 就 是 说 , 当 需 要 修改 一 个 限制 属性 值 时 ,接受 属 
性 的 外 部 部 件 首先 要 检查 这 个 属性 的 合理 性 再 决定 是 否 接受 修改 。 


2 方法 


JavaBean 归根 到 底 是 一 个 Java 类 ,所 有 的 public 方法 都 可 以 通过 对 象 外 部 直接 调用 。 
JavaBean 中 常用 的 方法 是 单 值 属 性 设置 器 /获取 器 , 即 对 于 每 一 个 属性 ,都 有 一 对 set 方法 
和 get 方法 来 实现 对 属性 值 的 赋值 和 获取 属性 值 。 


3. 事件 
JavaBean 和 其 他 软件 组 件 交流 信息 的 主要 手段 是 发 送 和 接收 事件 。 在 新 的 AWT 事 
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件 模 型 中 ,一 个 事件 源 可 以 注册 事件 监听 器 对 象 , 当 事 件 源 检测 到 某 种 事件 发 生 时 ,将 激活 
检测 器 对 象 中 一 个 相应 的 事件 处 理 方法 。 

JavaBean 必须 能 够 发 送 事件 变化 通知 和 监听 到 其 他 JavaBean 的 事件 变化 ,并 对 监听 到 
事件 变化 进行 相应 的 业务 处 理 。 事 件 的 监听 原理 是 : 首先 事件 源 必 须 对 需要 发 送 的 事件 
了 注册 ,然后 注册 事件 监听 器 ,并 说 明 该 事件 源 所 发 生 的 事件 向 什么 组 件 发 送 ,也 就 是 说 ， 
有 件 源 组 件 中 实现 方法 并 在 监听 组 件 中 注册 该 事件 源 。 

【 例 6-4】 JavaBean 应 用 举例 。 
在 Web 应 用 中 ,用 户 定 义 的 类 或 JavaBean 通常 存储 在 根 目 录 下 的 “WEB-INF\classes\ 
包 \” 文 件 夹 中 ,Java 通过 包 来 实现 用 户 类 的 分 类 存储 和 管理 。 
一 个 名 为 NameCard 的 JavaBean 代码 如 下 (文件 名 NameCard. java) : 


4 


的 
进 
在 


jp 


package cards; 
public class NameCard 
{ 
String Name, Address; 
public NameCard( ) // 默认 构造 函数 
{ 
this. Name = "John"; 
this. Address = "No, Road, City, Country"; 
} 
public void setName(String myName) 
{ 
this. Name = myName; 
} 
public String getName( ) 
{ 
return (this. Name); 
} 
public void setAddress (String myAddress) 
{ 
this. Address = myAddress; 
} 
public String getAddress () 
{ 
return (this. Address); 
} 
} 


上 述 JavaBean 应 存储 在 Web 应 用 特定 的 文件 夹 中 , 即 Web 应 用 根 目录 中 “WEB-INF\ 
classes\cards” 下 ,用 javac NameCard. java 编译 生成 NameCard. class, 该 文件 将 存储 在 
cards 包 中 , 即 cards 子 文件 夹 中 。 

当 JavaBean 完成 后 ,为 了 测试 JavaBean 的 功能 ,可 以 在 bean 类 中 临时 增加 main 方 
法 ,借用 main 方法 来 调试 bean。JavaBean 的 主要 应 用 是 将 JavaBean 应 用 于 JSP 页 面 中 ， 
关于 在 JSP 中 使 用 JavaBean, 将 在 6. 4. 5 节 进 行 详细 介绍 。 


6.3.2 JavaBean、EJB 和 Java 类 的 区 别 
JavaBean 是 可 复 用 的 组 件 ,对 JavaBean 并 没有 严格 的 规范 ,理论 上 讲 , 任 何 一 个 Java 


第 6 章 “服务 端 编程 


类 都 可 以 是 一 个 Bean。 但 通常 情况 下 ,由 于 JavaBean 是 被 容器 所 创建 (如 Tomcat) 的 ,所 
以 JavaBean 应 具有 一 个 无 参 构造 函数 。JavaBean 都 是 public 类 ,对 于 一 个 名 为 x 的 属性 ， 
通常 要 写 两 个 函数 getX() 和 setX() ,对 于 其 Bean 的 一 般 函 数 不 需 要 遵守 上 述 的 命名 规则 ， 
但 是 需要 为 public。 此 外 ,通常 JavaBean 还 要 实现 Serializable 接口 用 于 实现 Bean 的 持久 
性 ,JavaBean 不 能 被 跨 进 程 访问 。 

Enterprise JavaBean(EJB) 是 基于 Java 的 远程 方法 调用 (RMI) 技 术 , 所 以 EJB 可 以 被 
远程 访问 ( 跨 进程 , 跨 计算 机 )。 但 EJB 必须 被 部 署 在 诸如 WebShpere、WebLogic 这 样 的 容 
器 中 ,EJB 客户 从 不 直接 访问 真正 的 EJB 组 件 ,而 是 通过 其 容器 访问 。EJB 容器 是 EJB 组 
件 的 代理 ,EJB 组 件 由 容器 所 创建 和 管理 。 客 户 通 过 容器 来 访问 真正 的 EJB 组件。 


(6.4 JSP 技术 


使 用 Servlet 开发 服务 端 中 间 层 逻辑 ,实在 是 太 复杂 了 。 为 此 ,Sun 公司 于 1999 年 推出 
JSP 技术 。JSP 是 一 种 Java 平台 技术 , 它 是 在 传统 的 HTML 文档 (x .htm、x. html) 中 加 
入 Java 脚本 程序 (Scriptlet) 和 JSP 标记 来 构成 的 , 它 包 装 了 Java Servlet 系统 界面 ,用 户 可 
以 在 JSP 页 面 上 直接 书写 Java 代码 ,这 样 就 大 大 简化 了 Java 和 Servlet 的 使 用 难度 。 此 
外 ,作为 一 种 服务 器 脚本 语言 ,JSP 是 在 编译 成 Servlet 后 才能 实际 运行 。 当 用 户 浏览 . jsp 
网 页 时 ,首先 在 服务 器 端 执行 . jsp 文档 中 服务 端 代码 ,然后 把 执行 结果 传送 到 客户 端 浏览 
器 ,基本 上 与 浏览 器 无 关 。 


6.4.1 JSP 的 运行 环境 


要 运行 JSP 页 面 , 在 Web 服务 器 端 ,需要 安装 Tomcat 应 用 服务 器 。Tomcat 通常 和 
Apache Web 服务 器 一 起 共同 构成 一 个 Web 站 点 。 


1. 运行 与 开发 环境 
JSP 的 运行 和 开发 环境 框架 模型 如 图 6-7 所 示 。 
Web 服 务 器 
数据 库 服务 器 
客户 中 人 (数据 管理 ) 


浏览 器 HTML/ServleVEJB/JSP 网 页 
Web 服 务 器 +Tomcat(ServletJSP 引 擎 ) 
Java 运 行 环境 (Java 虚 拟 机 ) 


操作 系统 


浏览 器 


数据 库 


浏览 器 


1 
1 
1 
1 
1 
1 
1 
1 
1 
1 
1 


图 6-7 JSP 的 运行 和 开发 环境 


JSP 的 开发 .运行 环境 很 多 ,可 以 采用 UNIX、Linux、Windows Server 等 不 同类 型 的 操 
作 系 统 , 如 果 希 望 在 服务 器 上 开发 Servlet/EJB/JSP 应 用 程序 ,还 应 该 安装 以 下 软件 。 

(1) 安装 Java 环境 。 

(2) 安装 Java VM(JRE),Tomcat 需要 Java VM 的 支持 。 
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(3) 安装 Tomcat 应 用 服务 器 。Tomcat 是 针对 Apache 服务 器 开发 的 JSP 应 用 服务 
器 ,是 Java Servlet 和 Java Server Pages 技术 的 标准 实现 ,是 基于 Apache 许可 证 开发 的 自 
由 软件 。 可 以 这 样 认 为 , 当 在 一 台 机 器 上 配置 好 Apache 服务 器 ,可 利用 它 响应 对 HTML 
页 面 的 访问 请 求 。 实 际 上 Tomcat 部 分 是 Apache 服务 器 的 扩展 ,但 它 是 独立 运行 的 ,所 以 
当 运 行 Tomcat 时 , 它 实际 上 作为 一 个 与 Apache 独立 的 进程 单独 运行 。 当 配置 正确 时 ， 
Apache 为 . html 页 面 服务 ,而 Tomcat 实际 上 运行 . jsp 页 面 和 Servlet。 

(4) Apache 服务 器 。 可 以 根据 需要 安装 Apache 服务 器 。 本 章 主 要 是 介绍 JSP 的 开 
发 ,因此 ,只 要 安装 Tomcat 就 可 以 了 。 


2. JSP 程序 页 面 测试 站 点 


为 了 测试 后 面 要 学 习 的 JSP 程序 ,我们 继续 使 用 6. 1. 2 节 建 立 的 站 点 d:\haobook , 虚 
拟 目录 为 /book”。 所 有 的 要 测试 的 JSP 页 面 , 只 要 保存 到 d:\haobook 文件 夹 中 即 可 。 如 
果 要 测试 一 个 JSP 文档 1.jsp, 在 地 址 栏 中 输入 http://127.0.0.1/book/1.jsp。 注 意 ,必须 
要 输入 扩展 名 ,同时 要 注意 文件 名 和 目录 的 大 小 写 。 


6.4.2 JSP 的 语法 结构 


JSP 文档 是 通过 在 HTML 文档 中 加 入 Java 脚本 程序 构成 的 。Java 脚本 程序 代码 用 
“二 %” 和 *% 二 " 定 界 符 括 起 来 , 称 为 JSP 元 素 。JSP 元 素 可 以 分 为 三 种 类 型 : 脚本 元 素 、 指 
令 元 素 和 动作 元 素 。 脚 本 元 素 规范 JSP 中 所 使 用 的 Java 代码 ; 指令 元 素 针 对 JSP 引擎 控 
制 转译 后 的 Servlet 的 整个 结构 ; 动作 元 素 主 要 连接 用 到 的 组 件 ( 如 JavaBean 和 Plugin)， 
另外 它 还 可 以 控制 JSP 引擎 的 行为 。 


1. JSP 指令 


JSP 指令 是 JSP 的 引擎 。 它 们 不 直接 产生 任何 可 视 的 输出 ,只 是 指示 引擎 如 何 处 理 
JSP 页 面 中 的 内 容 。JSP 指令 由 二 %@…% 二 标记 ,一 般 形式 是 : 


<%@ 指令 名 属性 , = "属性 值 " 属性 ; = "属性 值 ”… 属性 。 = "属性 值 ”%> 
在 指令 书写 时 ,指令 名 和 “@” 符 号 之 间 需 留 有 空格 ,常用 的 JSP 指令 是 page 指令 和 


include 指 今 。 

1) page 指令 

page 指令 (at page) 用 来 定义 整个 页 面 的 相关 属性 ,以 及 定义 网 页 的 处 理 方式 ,如 到 何 
处 寻找 Java 类 支持 等 。 指 令 的 语法 如 下 : 


<%@ page 
[ language =" java" ] 
[ extends = "package. class" ] 
[ import ="{package. class | package. * }, …" ] 
[ session = "true | false" ] 
[ buffer = "none | 8kb" ] 
[ autoFlush = "true | false" ] 
[ isThreadSafe = "true | false" ] 
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[ info = "text" ] 
[ contentType = "mimeType [ ;charset = characterSet ]" | 
"text/html ; charset = ISO- 8859- 1" ] 
[ errorPage = "relativeURL" ] 
[ isErrorPage = "true | false" ] %> 
下 面 是 page 指令 的 几 个 常用 属性 。 
(1) language 属性 ,所 使 用 的 脚本 语言 。 例 如 ,二 %W@ page language 二 "Java" % 记 。 
(2) import 属性 ,脚本 元 素 中 使 用 的 类 ,与 Java 中 的 import 声明 作用 相同 ,应 是 类 的 全 
名 ,或 者 类 所 在 的 包 。 例 如 : 
<% @ page import = "java. util. Date" %> 
<%@ page import = "java. io. x* "名 > (java. io 包 中 的 所 有 类 在 本 页 中 都 可 以 使 用 ) 
(3) session 属性 ,是 否 使 用 session 对 象 。 
(4) buffer 属性 ,对 象 out 的 输出 模式 。none 为 没有 缓冲 区 ; 8KB 为 缓冲 区 大 小 。 
(5) autoFlush 属性 ,缓冲 区 已 满 时 是 否 自动 清空 。 当 buffer 为 none 时 该 属性 不 能 为 
false。 
(6) isThreadSafe 属性 ,处理 对 象 间 的 存 取 是 否 引 入 Thread Safe 机 制 。 如 果 为 true， 
则 在 程序 中 必须 有 多 线程 的 程序 代码 ,否则 直接 实现 SingleThreadModel 机 制 。 
(7) contentType 属性 ,输出 到 客户 端的 MIME 类 型 和 字符 集 。 默 认 的 字符 集 是 ISO- 
8859-1。 例 如 ,使 用 中 文字 符 集 : 二 %@ page contentType 王 ”text/html;gb2312”% 二 。 
(8) errorPage 属性 ,设置 异常 处 理 网 页 。 
(9) isErrorPage 属性 ,当前 网 页 是 否 为 男 一 个 JSP 网 页 的 异常 处 理 网 页 。 
在 使 用 page 指令 时 ,如 果 指 令 的 属性 较 多 ,可 以 写成 多 条 page 指令 。 几 乎 所 有 的 JSP 
页 面 都 会 用 到 page 指令 ,在 JSP 文档 的 开始 ,常常 看 到 如 下 的 page 指令 ,以 定义 网 页 的 处 
理 方式 ， 
<%@ page import = "java.util.Date"” > // 导 入 页 面 中 用 到 的 java 类 
<$% @ page errorPage = "errorPage. jsp”%>// 当 出 现 错误 时 的 错误 处 理 网 页 
<%@ page session = "true" %> 
2) include 指令 
include 是 一 个 在 JSP 网 页 中 包含 其 他 文件 的 指令 , 它 是 在 JSP 引擎 将 它 转译 成 
Servlet 时 产生 作用 的 指令 。 其 一 般 形式 如 下 : 


<%@ include file = "被 插入 文件 的 url”%> 

这 里 要 求 , 被 包含 的 文件 必须 符合 JSP 的 语法 ,应 是 静态 文本 、 指 令 元 素 、 脚 本 元 素 和 
动作 元 素 。 注 意 ,包含 后 面 不 能 有 分 号 。 

2. 变量 声明 


在 JSP 中 ,变量 同样 有 全 局 变量 和 局 部 变量 的 概念 。 如 果 一 个 页 面 中 包含 多 个 “二 %” 
和 “% 二 ” 定 界 符 括 起 来 的 JSP 元 素 , 在 一 个 元 素 内 部 声明 的 变量 只 能 用 于 该 JSP 元 素 内 
部 。 如 果 希 望 变 量 声明 可 以 用 于 页 面 中 的 所 有 JSP 元 素 , 则 需要 定义 页 面 级 的 变量 。 变 量 
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声明 一 般 形 式 如 下 : 
<%! 
类 名 变量 名 [, 变量 名 ][, 变量 名 ] …; 


第 > 


在 变量 声明 中 ,可 以 为 变量 赋 初 值 ,需要 用 分 号 来 结束 变量 声明 ,同时 任何 内 容 必须 是 
有 效 的 Java 语句 。 例 如 : 

<%! 

String truename, nickname; 

String[ ] ss; 

int i=0; 

java. util. Date newsdate; 

%> 

注意 ,声明 后 面 的 分 号 不 能 省 略 。 

3. 表达 式 


表达 式 是 常量 .变量 函数 .运算 符 、 括 号 连接 而 成 的 式 子 。 在 程序 设计 中 ,通过 表达 式 
完成 对 数据 的 运算 ,以 及 为 变量 赋值 。 在 JSP 文档 中 ,可 以 将 表达 式 的 结果 直接 输出 到 页 
面 中 。 一 般 形 式 是 : 二 % 三 表达 式 % 之 。 例 如 ; 

<% = i%> // 输 出 变量 i 的 值 

<% = "Hello" %> // 输 出 字符 串 常 量 

需要 特别 注意 的 是 *%” 和 “二 "之 间 不 能 有 空格 。 

4. 代码 段 /脚本 片段 


JSP 代码 段 或 脚本 片段 包含 在 “一 外 … % 二 ”标记 对 内 。 当 Web 服务 器 响应 请 求 时 ， 
这 种 Java 代码 就 会 运行 。 在 脚本 片段 周围 可 能 是 纯粹 的 HTML 或 XML 代码 ,在 这 些 地 
方 ,代码 片段 可 以 创建 条 件 执行 代码 ,或 只 是 调用 另外 一 段 代 码 。 

例如 ,以 下 的 代码 组 合 使 用 表达 式 和 脚本 片段 ,分 别 按照 H1、.H2、H3、H4 和 H5 标题 
样式 ,显示 字符 串 “ 你 好 ”, 脚 本 片段 并 不 局 限于 一 行 源 代 码 中 : 

<% for (inti=1; i<=4; i++){ %> 


<H<% =ig%>> 你 好 </H<$% = i%>> 
<% } %> 


上 述 代码 在 服务 端 执行 后 ,发 送 到 客户 端的 HTML 代码 为 : 
<Hl > 你 好 </HL >< H2 > 你 好 </H2 ><H3 > 你 好 </H3 >< H4 > 你 好 </H4> 
5. 注释 


在 文档 中 加 入 HTML 注释 ,用 户 可 以 通过 查看 页 面 源 代码 来 看 到 这 些 注释 的 内 容 。 
如 果 不 想 让 用 户 看 到 注释 内 容 , 应 将 其 嵌入 过 %-- … 一 % 志 标记 对 。 一 般 形 式 是 : 
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<% 一 -注释 内 容 -- $%> 


【 例 6-5】 编写 一 个 JSP 文 档 , 显 示 网 页 的 访问 次 数 。 
首先 定义 一 个 统计 访问 次 数 的 文档 ,文档 名 为 mycount. jsp。 内 容 如 下 : 
<%! private int accessCount =0; %> 
<table border = "0" width= "100% " height = "60" bgcolor = "#FFFF00"> 
<tr height = "50"> 
<td width= "20%" > 主机 名 : <% = request. getRemoteHost()%></td> 
<td width= "20% "> 访问 次 数 : <% = ++accessCount %></td> 
< td> 当 前 时 间 : <% = new Date() %></td> 
</tr> 
</table> 


定义 一 个 JSP 页 面 ,包含 上 述 文件 ,输出 一 个 随机 数 。mypage. jsp 文档 内 容 如 下 : 


<% @ page import = "java. util. * "%> 

<html> 

<body> 

<%! Random RdmNumber = new Random( ) ; %> 

<%@ include file = "mycount. jsp" %> 

<% 

out. println(RdmNumber. nextInt(100)); // 输 出 100 以 内 的 随机 整数 

%> 

</body> 

</html > 

将 上 述 文件 保存 在 d:/haobook 文件 夹 中 ,打开 浏览 器 ,在 浏览 器 地 址 栏 中 输入 
http://127.0.0.1/book/mypage.jsp 可 以 看 到 网 页 的 输出 结果 。 


6.4.3 JSP 中 的 数据 类 型 及 其 转换 


数据 类 型 是 一 个 编程 环境 中 非常 重要 的 语言 要 素 ,在 许多 情况 下 需要 进行 类 型 的 转换 。 
首先 ,不 同类 型 的 数据 的 运算 不 同 , 因 此 ,还 经 常 需要 将 不 同类 型 的 数据 进行 转换 ,例如 将 字 
符 串 类 型 转变 为 数值 型 等 。 其 次 ,如 果 要 将 数据 插入 数据 库 中 ,为 了 满足 数据 库 字 段 类 型 的 
需要 ,通常 也 需要 对 JSP 页 面 中 的 数据 类 型 进行 转换 。 我 们 不 准备 详细 地 介绍 JSP 的 所 有 
数据 类 型 ,只 是 对 常用 的 数据 类 型 及 其 转换 进行 简要 介绍 。 


1. 基本 数据 类 型 与 包装 类 


在 JSP 中 ,数据 类 型 分 为 基本 数据 类 型 和 类 两 种 形式 ,基本 数据 类 型 有 : int, 按 照 长 
度 不 同 , 又 分 为 byte(8b) .short(16b) ,int(32b) long(64b) 四 种 ; @float, 分 为 float( 单 精 
度 ,32b) 和 double( 双 精度 ,64b); @) char. unicode 字符 ; 由 boolean ,变量 的 取 值 有 true、 
false。 与 上 述 基 本 数据 类 型 对 应 的 是 对 应 的 类 ,分 别 是 Integer、 Short、 Byte、Long、Float、 
Double、Character、Boolean, 又 称 包装 类 。 

将 一 个 基本 类 型 数据 转换 为 类 对 象 , 称 为 正 向 转换 。 正 向 转换 可 以 通过 new( 一 个 新 的 
类 对 象 ) 调 用 构造 函数 完成 ,例如 : Integer a 二 new Integer(2); float b 一 new Float(3. 14)。 

将 一 个 类 对 象 转 换 为 基本 类 型 数据 , 称 为 反 向 转换 。 这 可 以 调用 类 的 成 员 函 数 实现 。 
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例如 : int ia 二 a. intValue(); 其 中 a 是 一 个 Integer 对 象 。float fb 一 b. floatValue(),b 为 
Float 对 象 。 


2. 整数 类 型 和 字符 串 类 型 的 转换 


在 JSP 中 ,int 和 String 数据 类 型 间 互 相 转换 的 具体 方法 如 下 。 
(1) 将 字 串 String 类 型 转换 成 整数 int 类 型 。 通 过 Integer 类 可 以 将 字符 串 转 化 为 某 种 
进 制 的 整数 数据 ,一 般 形式 是 : 


int i = Integer.parseInt([String]); 


int i = Integer.parseInt([String], [int radix]); 


int i = Integer.valueOf(my_str). intValue(); 


其 中 ,最 后 一 种 转换 是 将 一 个 字符 串 转 化 成 一 个 Integer 对 象 , 然 后 再 调用 这 个 对 象 的 
intValue() 方 法 返回 其 对 应 的 int 数值 。 

(2) 将 整数 int 类 型 数据 转换 成 字符 串 String 类 型 数据 。 

一 般 形式 是 : 


String s = String.valueOf(i); 


String s = Integer. toString(i); 


Strings = "" + i; 
对 于 Double、Float、Long 类 型 数据 和 字符 串 类 型 之 间 的 转换 方法 大 同 小 异 。 例 如 : 


long ln = java. lang. Long. parseFloat("123.5"); 


float f = Float. valueOf ("123. 5"). floatValue( ) 
详细 介绍 略 。 
3. 字符 串 类 型 和 日 期 型 数据 的 转换 


在 数据 库 中 ,通常 有 Datetime 类 型 的 数据 字段 。 在 MySQL 或 MS SQL 中 ,可 以 直接 
把 字符 串 插入 日 期 类 型 的 列 中 ,SQL 会 隐 式 做 格式 转换 ,将 字符 串 类 型 转 为 日 期 类 型 。 但 
是 ,字符 串 的 格式 必须 是 yyyy-mm-dd 或 yyyymmdd 形式 ,例如 2008-12-10 或 20081210。 

如 果 从 数据 库 中 读 取 一 个 Datetime 类 型 的 数据 字段 NewsDate, 可 以 有 不 同 的 读 取 方 
式 ,包括 getString("NewsDate") ,getDate("NewsDate") 等 ,前 者 返回 一 个 String 数据 ,后 
者 返回 一 个 Date() 类 型 的 数据 。 
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在 JSP 中 ,也 可 以 将 字符 串 转换 成 Date 类 型 。 例 如 : 


String strDate = '03/16/2012'; 
java. util. Date mydate = new SimpleDateFormat("dd/MM/YYYY") .parse(strDate ); 


即 可 得 到 对 应 的 日 期 数据 。 

【 例 6-6】 编写 一 段 JSP 代码 ,从 SQL 数据 库 读 取 一 系列 的 新 闻 记 录 ,显示 新 闻 列 表 。 
如 果 新 闻 发 布 日 期 未 超过 7 天 ,在 新 闻 列 表 项 后 显示 红色 的 New。 

分 析 : 这 是 网 站 中 一 个 常见 的 功能 ,主要 技术 点 就 是 数据 库 中 Datetime 数据 的 读 取 以 
及 Date 类 型 的 操作 。 关 于 数据 库 的 读 取 , 使 用 SQL 命令 ,语法 容易 理解 。 

代码 清单 : 


<% 
String newsid, newstitle, newsdatestr, newstr; 
java. util. Date newsdate, dNow = new java. util. Date( ); 
long daydiff = 0; 
strSQL = "SELECT NewsID, NewsTitle, NewsDate " 
+ "FROM news " 
十 "WHERE NewsType = N'" + newstype + "人 
+ "AND NewState=1" 
+ "ORDER BY NewsDate DESC "; 
rs= gslpub. executeQuery( strSQL); 
int i=0; 
while (rs. next()) 
{ 
newsid= rs. getString( "NewsID"); 
newstitle= rs. getString("NewsTitle"); 
// 数据 库 中 的 日 期 型 数据 ,也 可 以 是 getString 
newsdatestr = rs. getString( "NewsDate" ); 
newsdate = rs. getDate( "NewsDate" ); 
//SimpleDateFormat formatter = new SimpleDateFormat ("yyyy. MM. dd" ) ; 
daydiff = (dNow. getTime( ) - newsdate. getTime())/(24 * 60 x 60 * 1000); 
if (daydiff <=7) 
newstr = "< font color = 'red>[< i> new</i>]</font >"; 
else 
newstr = ""; 
newstitle= "< a href = 'mynews/news — page. jsp?newsid = " + newsid + "&closeflag=1'" + 
newstitle+ "(" + newsdatestr. substring(0,10) + ")</a>" + newstr; 
out. print("<p class = 'text01>" + newstitle + "</p>"); 
} 
第 > 


如 果 通 过 import java. util. Date; 导 入 Date 类 , 则 在 类 对 象 声 明 前 无 须 指定 java. util. 
Date ,直接 使 用 Date 二 对 象 二 即 可 声明 一 个 Date 对 象 。 


4. 字符 串 类 型 和 字符 串 数组 类 型 的 转换 


在 JSP 页 面 中 ,一 种 常用 的 操作 就 是 将 一 个 字符 串 split 转换 为 一 个 字符 串 数组 ,或 将 
一 个 字符 串 数组 合并 成 一 个 字符 串 。 例 如 ,将 string 二 "aa,bb,cc" 转 换 成 Vector 数据 类 型 ， 
分 别 包含 三 个 字符 串 元 素 一 一 "aa"、"bb" "cc"。 代 码 如 下 : 


String strData= ”aarbb,cc "; 
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String strlist[] = new String[20]; 

strlist = strData. split(","); 

上 述 操作 可 以 间接 地 实现 对 字符 串 数组 赋 初 值 。 

在 Web 开发 中 ,用 做 字符 串 分 隔 符 的 字符 可 能 是 字符 串 本 身 数据 的 一 个 字符 ,因此 在 
实际 编程 时 ,如 何 选取 字符 串 分 割 符 非常 重要 。 根 据 我 们 的 开发 经 验 ,通常 使 用 两 个 不 可 打 
印 的 字符 “\10” 和 “\20” 作 为 分 割 符 ,因为 这 两 个 字符 用 户 很 少 直接 输入 ,不 太 可 能 是 字符 串 
本 身 的 数据 。 例 如 ,在 下 面 的 示例 代码 中 ,字符 串 ss 中 ,定义 了 2 级 字符 串 的 分 隔 结构 ,分 
别 存储 了 一 组 超 链接 的 显示 文本 和 文件 路 径 。 

<% 

String fl = "\10"; 

String f2 = "\20"; 

String ss; 

String[ ] s1, s2; 

if (ss. length()>0) 

{ 

sl= ss. split(f1); 
for(int k=0;k<sl.length;k++) 
{ 
s2 = sl[k]. split(f2); 
out.print("<a href ='" + s2[1] + ">" + s2[0] +"</a><br>"); 
} 
} 


注意 ,在 上 述 代码 中 , 求 字 符 串 的 长 度 和 字符 数组 的 长 度 使 用 的 方法 不 同 。 如 果 最 后 一 
个 分 割 符 后 面 没有 内 容 , 即 字符 串 ss 的 最 后 一 个 字符 是 分 隔 符 全 , 则 分 割 后 的 数组 将 不 会 
包含 一 个 空 元 素 。 

对 于 字符 串 对 象 的 操作 ,在 编程 时 注意 以 下 两 个 常用 操作 的 使 用 。ODequals() 方 法 , 字 
符 串 比较 运算 ,使 用 时 一 般 需要 将 字符 串 常 量 放 在 前 面 ,变量 放 在 方法 内 ,这 样 当 变量 值 为 
null 时 不 会 产生 异常 。 例 如 :"a". equals(str) ,str 为 null 时 ,不 会 报错 。 执 行 str. equals 
("a"), 当 str 为 null 时 ,程序 将 发 生 异 常 而 报错 。@trim() ,字符 串 截 尾 函 数 ,对 于 一 个 取 
值 为 null 的 String 对 象 进行 trim() 操 作 , 将 发 生 异 常 ,输出 null, 因 此 在 操作 前 应 该 使 用 if 


Cstr! 一 null) str 一 str. trim() 。 
5. 数组 类 型 和 集合 类 


无 论 是 什么 样 的 程序 设计 ,数组 (Array) 都 是 一 种 常用 的 数据 类 型 。 和 上 述 简单 的 数 
组 类 型 相 比 ,Java 中 还 提供 了 Vector、ArrayList 集合 类 。 集 合 类 和 数组 不 同 , 当 数组 中 元 
素 的 个 数 不 确 定时 ,可 以 使 用 java. util. Vector 类 。 例 如 : 
Vector v = new Vector(); 
for (inti= 0; i<strlist. length;i++) 
v.add (strlist[i]); 
return v; 


和 Array 数组 相 比 ,Vector 集合 只 能 存放 java. lang. object 对 象 , 不 能 用 于 存放 基本 类 
型 数据 。 例 如 ,要 存放 一 个 整数 10, 得 用 new Integer(10) 构 造 出 一 个 Integer 包装 类 对 象 ， 
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才能 add 到 Vector 集合 中 。 和 Array 相同 的 是 也 通过 元 素 的 整数 索引 来 访问 Vector 元 
素 ,调用 Vector 的 size() 方 法 时 ,可 以 返回 Vector 集合 中 实际 元 素 的 个 数 。 

在 Java 中 , Vector 类 和 ArrayList 类 具有 相似 的 功能 。 从 内 部 实现 机 制 来 讲 ， 
ArrayList 和 Vector 都 是 使 用 数组 来 控制 集合 中 的 对 象 , 当 从 一 个 指定 的 位 置 (通过 索引 ) 
查找 数据 或 是 在 集合 的 末尾 增加 、 移 除 一 个 元 素 时 ,两 者 所 花费 的 时 间 相同 。 

但 是 ,从 同步 的 角度 讲 ,Vector 是 同步 的 , 它 的 一 些 方法 保证 了 Vector 中 的 对 象 是 线程 
安全 的 。ArrayList 则 是 异步 的 ,因此 ArrayList 中 的 对 象 并 不 是 线程 安全 的 。 因 为 同步 的 
要 求 会 影响 执行 的 效率 ,所 以 如 果 不 需 要 线程 安全 的 集合 ,那么 使 用 ArrayList 是 一 个 很 好 
的 选择 ,这样 可 以 避免 由 于 同步 带 来 的 不 必要 的 性 能 开销 。 

可 见 ,如 果 仅 仅 是 作为 数组 存储 数据 ,应 该 选择 使 用 简单 数组 ,使 用 一 个 简单 的 数组 
(Array) 来 代替 Vector 或 ArrayList。 尤 其 是 对 于 执行 效率 要 求 高 的 程序 更 应 如 此 。 因 为 
使 用 数组 避免 了 同步 、 额 外 的 方法 调用 和 不 必要 的 重新 分 配 空间 所 带 来 的 消耗 。 


6.4.4 JSP 内 置 对 象 


内 置 对 象 是 由 开发 环境 所 定义 的 具有 特定 功能 的 对 象 , 用 户 可 以 直接 使 用 。 在 JSP 脚 
本 段 中 ,可 以 访问 这 些 隐 含 对 象 来 与 JSP 网 页 中 的 可 执行 Servlet 环境 交互 。JSP 中 包含 了 
一 系列 的 内 置 对 象 , 常 用 的 内 置 对 象 介绍 如 下 。 


1. request 对 象 


在 JSP 中 ,内 置 对 象 request 对 象 是 javax. servlet. HttpServletRequest 类 的 一 个 子 类 
对 象 , 当 客户 端 请 求 一 个 JSP 页 面 时 ,JSP 容器 会 将 客户 端的 请 求 信 息 及 HTTP 头 封装 在 
request 对 象 中 。request 对 象 常用 的 方法 见 表 6-2 。 


表 6-2 ”request 对 象 常用 方法 


方 ”法 说 明 

getHeader(String name) 获得 HTTP 定义 的 文件 头 的 值 

getHeaders(String name) 获得 一 个 HTTP 请 求 头 的 所 有 值 

getRemoteAddr() 获取 客户 端的 IP 地 址 

getRemoteHost() 获得 客户 端 主机 的 名 字 , 如 果 该 方法 失败 , 则 返回 客户 端 计算 机 的 IP 
地 址 

getRequestURL() 获得 客户 端 请 求 的 URL 

getRequestURI() 获得 客户 端 请 求 的 URI 

getMethod() 获得 请 求 方法 (GET、POST) 

getParameter(String name) 返回 客户 端 传送 某 个 请 求 参数 的 值 , 或 者 是 表单 数据 。name 指定 传 
递 的 参数 名 或 表单 的 输入 域名 

getParameterNames() 获取 客户 端 传 来 的 所 有 参数 的 名 字 ,返回 值 为 Enumeration 类 实例 

getParameterValues(String name) ”获取 客户 端 中 参数 名 为 name 的 所 有 值 

getCookies() 返回 客户 端的 Cookies 对 象 ,结果 是 一 个 Cookie 数组 

getQueryString() 返回 查询 字符 串 ,该 字符 串 由 客户 端 以 GET 方法 向 服务 器 端 传 送 。 


查询 字符 串 出 现在 页 面 请 求 “?” 的 后 面 
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通过 request 对 象 可 以 获取 用 户 访 问 网 页 时 传人 的 参数 值 或 表单 中 的 输入 。 例 如 ,在 
网 页 a. htm 中 包含 一 个 表单 ,其 二 form 过 的 action 属性 指定 表单 处 理 页 面 为 b. jsp, 在 
b.jsp 中 ,可 以 通过 request. getParameter 方法 来 获取 a. htm 中 的 表单 输入 数据 。 

要 获取 一 个 网 页 的 userName 参数 的 值 , 代 码 如 下 : 


<% String name = request. getParameter("userName" ) ; out.println(name); $%> 


需要 说 明 的 是 ,HTTP 传输 默认 的 编码 是 ISO-8859-1, 因 此 在 浏览 器 发 出 请 求 时 给 出 
的 URL 是 编码 后 的 字符 串 , 这 样 当 有 中 文 时 ,服务 器 得 到 的 是 一 个 包含 乱码 的 URL 字符 
串 ,在 目标 页 面 中 要 得 到 正确 的 中 文 数据 ,需要 进行 代码 转换 。 中 文字 符 编 码 转 换 函 数 
如 下 : 


<%! 
public String codeToString( String str) 
{ // 中 文字 符 串 数据 编码 转换 函数 
String s = str; 
try{ 
byte tempB[ ] = s. getBytes("IS0— 8859— 1"); 
s= new String(tempB); 
return s; 
} 
catch(Exception e) { 
return s; 
} 
} 
%> 


这 样 就 可 以 将 得 到 的 中 文 数 据 转 换 为 正常 的 中 文 编码 了 。 例 如 : 


<% 

String msgtitle = codeToString(request. getParameter("msgtitle")); 

String msgcontent = codeToString( request. getParameter("msgcontent")); 

%> 

为 了 使 用 方便 ,可 以 将 上 述 编 码 转 换 函 数 定义 为 一 个 JavaBean, 然 后 通过 在 JSP 页 面 
中 导入 即 可 使 用 。 


2. response 对 象 


在 JSP 中 ,response 对 象 是 一 个 javax. servlet. HttpServletResponse 类 的 实例 ,封装 了 
服务 器 响应 客户 请 求 的 信息 。response 对 象 的 作用 是 向 客户 端 返回 请 求 , 即 给 客户 端 传送 
输出 信息 ,设置 表 头 等 。 常 用 的 方法 见 表 6-3。 

表 6-3 response 对 象 常用 方法 


方 ” 法 说 有明 


setContentType(String s) 重新 设 定 传 回 网 页 的 文件 格式 和 编码 方式 。 常 用 的 文件 格式 有 
text/html ,text/plain( 文 本 文件 ) application/xmsexcel(Excel 文件 ) 
和 applicaiton/word(Word 文件 ) 
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续 表 
方 法 说 明 
addHeader(String name，String ”添加 HTTP 头 ,该 Header 将 会 传 到 客户 端 ,如 果 有 同名 的 Header 
value) 存在 ,原先 的 Header 会 被 覆盖 


setHeader ( String name，String 设 定 指定 名 字 的 HTTP 头 的 值 ,如 果 该 值 存在 , 它 将 会 被 新 的 值 
value) 覆盖 


addCookie( Cookie c) 添加 一 个 Cookie 对 象 

setStutus(int n) 设置 HTTP 链接 中 的 服务 端 响应 的 状态 码 
sendError(int sc) 传送 状态 码 

sendError(int sc，String msg) 传送 状态 码 和 错误 信息 

sendRedirect( URL url) 页 面 重 定向 ,将 客户 端 重新 定向 到 URL 所 指向 的 页 面 


使 用 response 对 象 可 以 设置 客户 端的 页 面 跳 转 、 页 面 自动 刷新 、 页 面 自动 跳 转 等 。 示 
例 代码 如 下 : 
<S% 
response. setHeader( "Refresh", "5;URL = http://www. baidu. com" ); 
response. sendRedirect("a. jsp"); // 重 定位 到 a. jsp 页 面 
%> 
上 述 代码 可 以 使 得 客户 端 在 5 秒 钟 后 重新 自动 跳 转 到 一 个 新 的 网 址 ,或 直接 重新 定位 
到 一 个 新 的 页 面 。 
需要 说 明 的 是 ,在 sendRedirec() 方 法 中 ,如 果 重 新 定位 的 网 址 中 含有 参数 ,参数 值 为 中 
文 的 话 , 例 如 “response. sendRedirect("b. jsp? teachername 一 张 三 &page 二 1");” 在 重新 定 
位 的 页 面 b. jsp 中 ,不 能 正确 获得 teachername 参数 的 值 。 


3. Session 对 象 


所 谓 会 话 (Session) ,是 指 一 个 用 户 和 Web 服务 器 之 间 的 一 次 链接 。 当 用 户 使 用 浏览 
器 登录 到 Web 服务 器 ,并 初次 浏览 一 个 JSP 应 用 的 某 个 网 页 开始 ,直到 用 户 离开 网 站 或 超 
时 未 继续 浏览 该 网 站 网 页 为 止 ,之 间 的 浏览 操作 算 作 一 次 会 话 。 

Session 对 象 是 JSP 为 每 一 个 会 话 而 建立 的 个 人 对 象 ,可 以 存储 及 提供 个 别 用 户 独 享 的 
永久 或 半 永 久 信 息 。 它 是 一 个 与 request 相关 的 javax. servlet, http. HttpServletSession 对 
象 。 当 一 个 用 户 首次 访问 服务 器 上 的 一 个 JSP 页 面 时 ,JSP 引擎 产生 一 个 Session 对 象 , 同 
时 分 配 一 个 String 类 型 的 ID 号 ,JSP 引擎 同时 将 这 个 ID 号 发 送 到 用 户 端 ,存放 在 Cookie 
中 ,这样 Session 对 象 和 用 户 之 间 就 建立 起 一 一 对 应 的 关系 。 当 用 户 再 次 访问 连接 该 服务 
器 的 其 他 页 面 时 ,不 再 为 用 户 分 配 新 的 Session 对 象 。 当 用 户 关 闭 浏 览 器 时 ,服务 器 端 保存 
的 该 用 户 的 Session 对 象 被 取消 ,服务 器 和 用 户 的 对 应 关系 也 被 取消 。 如 果 用 户 重新 打开 
浏览 器 再 连接 到 该 服务 器 时 ,服务 器 为 用 户 再 创建 一 个 新 的 Session 对 象 。 

Session 对 象 常用 的 方法 见 表 6-4。 
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表 6-4 ”Session 对 象 常用 方法 


方法 


说 明 


setAttribute(String name, value) 
getAttribute(String name) 
removeAttribute( String name) 
getCreationTime() 

getld() 


getLastAccessedTime() 


getMaxInactiveInterval () 


setMaxInactiveInterval (int interval) 


在 Session 对 象 中 设置 属性 ,并 为 该 属性 赋值 

获取 Session 对 象 指定 属性 的 值 ,如 果 该 属性 不 存在 ,将 会 返回 null 
删除 指定 属性 的 属性 名 和 属性 值 

返回 Session 对 象 被 创建 的 时 间 , 单 位 为 毫秒 

返回 Session 对 象 在 服务 器 端的 编号 。 每 生成 一 个 Session 对 象 , 服 
务 器 都 会 给 它 一 个 编号 ,编号 不 会 重复 ,服务 器 根据 编号 来 识别 
Session ,并且 正确 地 处 理 某 一 特定 的 Session 及 其 提供 的 服务 

返回 当前 Session 对 象 最 后 一 次 被 操作 的 时 间 ,单位 为 毫秒 

获取 Session 对 象 的 生存 时 间 ,单位 为 秒 

设置 Session 对 象 的 有 效 时 间 ( 超 时 时 间 ) ,单位 为 秒 。 具 体 值 应 根 
据 网 站 的 实际 应 用 情况 决定 ,设置 几 十 分 钟 是 很 正常 的 


【 例 6-7】 编写 一 个 JSP 页 面 , 当 用 户 访问 站 点 时 ,检查 是 否 通过 登录 页 面 正 常 登录 ， 
如 果 正 常 登录 则 在 Seesion 对 象 中 添加 属性 useraccount ,否则 ,显示 一 个 错误 页 面 ,然后 强 


行 跳 转 到 站 点 登录 页 面 。 


分 析 : 根据 Web 的 原理 ,要 访问 一 个 页 面 ,只 要 输入 页 面 对 应 的 URL 即 可 ,为 避免 用 
户 任意 地 访问 页 面 ,Web 系统 通常 要 求 用 户 登录 ,按照 系统 的 提示 访问 。 下 面 是 一 个 控制 
页 面 合法 访问 的 JSP ,文件 名 为 session-confirm. jsp。 


代码 清单 : 


< 有 四 page pageEncoding = "GBK" %> 


< 多 


String useraccount = (String)session. getAttribute("useraccount"); 


if (useraccount == null) { 
// 销 毁 当 前 Session 
session. invalidate( ); 
%> 
<html> 
<head> 


<meta http— equiv = "Content — 


</head> 


Type" content = "text/html; charset = gb2312"> 


<body oncontextmenu = "self. event. returnValue = false" scroll = "no"> 
<table width = 500 border = '1'align = 'center' cellspacing = '2' bgcolor = 'E0OE0E0> 


<tr height = 30> 


<td colspan = "2" align = "right" bgcolor = '#0066CC> 
<b><a href = "javascript:history. go( ~ 1)"><font color = "000000"> x </font ></a></b> 


</td> 
</tr> 
<tr height = 30> 


<td width = "100" rowspan = 


"3" align = "center" > 


< font face = "Wingdings' color = '#FF0000' style = 'font- size:32pt>L</font> 


</td> 


<td> 造 成 错误 的 原因 可 能 是 </td> 


</tr> 
<tr height = 30> 


<td> 未 进行 正常 登录 ,请 重新 登录 </td> 
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</tr> 
<tr height = 30> 
<td> 系 统 连 接 超 时 ,请 重新 登录 </td> 
</tr> 
<tr height = 30> 
<td colspan = "2" align = "center"><a href = 'javascript:history.go( -1)> 返 回 </a></td> 
</tr> 
</table> 
</body> 
</html > 
<% 
// 重 定向 到 Web 应 用 的 首页 
response. sendRedirect (request. getContextPath() + "/index. jsp"); 
} 
%> 


在 其 他 网 页 中 ,可 以 包含 该 页 面 ,这 样 就 可 以 保证 页 面 不 能 被 直接 访问 了 。 

4. application 对 象 

application 对 象 可 存储 并 提供 给 一 组 JSP 应 用 所 有 用 户 的 共享 信息 ,有 效 范围 为 构成 
该 JSP 应 用 的 所 有 JSP 页 面 ,可 以 实现 不 同 页 面 之 间 的 数据 共享 。 一般 情况 下 ,可 以 将 
application 对 象 作 为 一 个 存储 许多 共用 对 象 的 容器 , 这 是 一 个 javax. servlet. 
ServletContext 对 象 。 

application 对 象 常用 的 方法 见 表 6-5 。 

表 6-5 application 对 象 常用 方法 


方法 说 有明 
void setAttribute ( String key， 将 参数 Object 指定 的 对 象 obj 添加 到 application 对 象 中 ,并 为 添加 
Object obj) 的 对 象 指定 了 一 个 索引 关键 字 key, 如 果 添 加 的 两 个 对 象 的 关键 字 


相同 , 则 先前 添加 的 对 象 被 清除 
Object getAttribute(String key) ”获取 application 对 象 中 含有 关键 字 是 key 的 对 象 。 由 于 任何 对 象 都 
可 以 添加 到 application 对 象 中 ,因此 用 该 方法 取 回 对 象 时 ,应 强制 转 


化 为 原来 的 类 型 
removeAttribute(String key) 从 当前 application 对 象 中 删除 关键 字 是 key 的 对 象 
String getservletInfo() 获取 servlet 编译 器 的 当前 版 本 的 信息 


使 用 application 对 象 , 可 以 让 多 个 JSP ,servlet 共享 数据 。 例 如 ,有 两 个 JSP 页 面 a. jsp 
和 b.jsp。 在 页 面 a. jsp 中 包含 如 下 代码 : 
<$% @ page contentType = "text/html;charset = GBK" %> 
<% 
String str = "你 好 "; 
application. setAttribute("greeting", str); 
第 > 


在 另 一 个 页 面 b. jsp 中 可 以 访问 application 对 象 的 属性 。 代 码 如 下 : 


<%@ page contentType = "text/html;charset = GBK" %> 
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<% 
String str; 
str = (String)application. getAttribute("greeting"); 
out. print (str); 
%> 


此 外 ,使 用 application 对 象 ,还 可 以 获得 Web 应 用 配置 参数 。 在 JSP 页 面 中 ,访问 数据 
库 所 使 用 的 驱动 .URL、 用 户 名 、 密 码 可 以 写 在 配置 文件 web. xml 中 。 例 如 ,下 面 是 一 个 
web. xml 数据 : 


< context — param> 
< param - name > driver </param — name > 
< param— value > com. mysql. jdbc. Driver </param — value> 
</context - param> 
< context — param> 
< param— name > url </param — name> 
< param — value > jdbc:mysql://localhost:3306/javaee </param — value > 
</context - param> 
< context - param > 
<param— name > user </param - name > 
<param— value> root </param — value > 
</context - param> 
< context — param > 
< param - name > pass </param - name > 
<param— value> root</param 一 value> 
</context - param> 


通过 这 种 方式 ,将 配置 信息 放 在 web. xml 文件 中 进行 配置 ,避免 使 用 程序 编码 方式 写 
在 代码 中 ,可 以 更 好 地 提高 程序 的 移植 性 。 在 操作 数据 库 时 ,通过 application 对 象 ,可 以 获 


得 这 些 参数 的 配置 情况 。 
【 例 6-8】 编写 JSP 页 面 ,获取 Web 系统 的 数据 库 具体 配置 信息 ,并 输出 一 个 数据 
库 表 。 


分 析 : 数据 库 的 配置 信息 可 以 通过 Web 站 点 的 web. xml 进行 配置 ,该 配置 信息 通过 
JSP 的 内 置 对 象 application 获取 。 
代码 清单 : 


<% @ page language = "java" import = "java. util. *" pageEncoding = "gb2312" %> 
<%@ page import = "java. sql. * "%> 

<% 

// 从 配置 参数 中 获取 驱动 

String driver = application. getInitParameter("driver"); 
// 获 取 数 据 库 URL 

String url = application. getInitParameter("url"); 

// 获 取 用 户 名 和 密码 

String user = application. getInitParameter("user"); 
String pass = application. getInitParameter("pass"); 

// 注 册 驱 动 

Class. forName( driver); 

// 获 取 数据 库 连 接 


第 6 章 “ 服务 端 编程 


Connection conn = DriverManager.getConnection(url, user,pass); 
// 创 建 Statement 对 象 
Statement stmt = conn.createStatement(); 
// 执 行 查询 
ResultSet rs = stmt.executeQuery("SELECT x FROM newsinfo"); 
第 > 
<table bgcolor = "9999dd" border = "1" align = "center"> 
<% 
// 遍 历 结果 集 
while(rs. next()) { 
%S> 
<tr> 
<td><% =rs.getString(1) %></td> 
<td><% =rs.getString(2) %></td> 
</tr> 
< 第 
%> 
</table> 
对 于 application 对 象 , 当 站 点 服务 器 开启 的 时 候 ,application 就 被 创建 ,直到 网 站 关闭 。 
因此 ,application 对 象 可 能 持续 地 存在 几 个 月 甚至 更 长 的 时 间 ,可 以 用 于 实现 站 点 访问 记 数 
器 等 功能 。 例 如 ,在 站 点 首页 中 增加 如 下 代码 : 
<% 
Integer number = (Integer)application. getAttribute("Count"); 
if (number == nul1) { 
number = new Integer(1); 
application. setAttribute("Count", number); 
} 
else{ 
number = new Integer(number. intValue() + 1); 
application. setAttribute("Count", number); 
} 
$%> 
您 是 第 <% = (Integer)application. getAttribute("Count") %> 位 访问 者 


5. out 对 象 


out 对 象 用 于 发 送 输出 流 ,作用 是 将 结果 输出 到 客户 端 。 它 最 常用 的 方法 有 两 个 : 
print() 和 println()。 输 出 换行 符 使 用 newLine() 方 法 。 
例如 ,不 用 表达 式 , 可 以 直接 访问 隐 含 对 象 out 来 输出 信息 : 


<% out.println("< hl align = 'center'> Hello</hl >"); 多 > 


通常 情况 下 ,使 用 out. print() 可 以 输出 html 代码 ,以 动态 地 构造 html 页 面 内 容 , 如 生 
成 各 种 表格 等 。 


6. 其 他 对 象 
在 JSP 中 ,内 置 对 象 还 有 : Qconfig 对 象 .用 于 传递 在 Servlet 程序 初始 化 时 所 需 的 信 
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息 ; @pageContext 对 象 ,该 对 象 提 供 了 对 页 面 上 的 所 有 对 象 以 及 命名 空间 的 访问 ,用 于 管 
理 网 页 属性 ; @page 对 象 ,当前 页 面 ,相当 于 Java 中 的 this; @exception 对 象 ,错误 处 理 对 
象 ,用 于 处 理 捕 提 到 的 异常 。 

【 例 6-9】 编写 一 个 JSP 文档 ,完成 一 个 登录 界面 ,输入 用 户 名 和 密码 ,如 果 输 入 guest 
则 转移 到 一 个 默认 的 首页 ,如 果 不 输入 用 户 名 , 则 重新 回 到 该 页 ,直到 输入 正确 的 用 户 名 和 
密码 ,此 时 重 定向 到 注册 用 户 网 页 。 

分 析 : 在 一 个 JSP 中 ,包含 表单 ,表单 的 action 属性 可 以 指定 执行 本 页 本 身 ,这 样 可 以 
实现 一 些 特殊 的 效果 。 

代码 清单 : login. jsp 


<% @ page contentTYpe = "text/html;charset = gb2312" %> 
<html > 
<body> 
< 第 
String userName = request. getParameter("userName" ) ; 
if (userName! = null && !"" .equals(userName) ) 
response. sendRedirect("http://gsl. sdu. edu. cn/"); 
%> 
<form name = "forml" action = "login. jsp" method = "post"> 
< table border = "2" width= "300" cellspacing= "0" cellpadding= "0" align = "center"> 
<tr height = "50"> 
<td align = "center"> 用 户 登录 </td> 

</tr> 
<tr height = "35"> 

<td style = "font- size:13"> 用 户 名 : < input type = "text" name = "userName"></td> 
</tr> 
<tr height = "35"> 

<td style= "font - size:13"> 密 gnbsp;&nbsp; 码 : < input type = "text" name = "userPassword"> 
</td> 
</tr> 
<tr height = "40"> 

<td align = center >< input type = "submit" value = "登录 "></td> 
</tr> 
</table> 
</form> 
</body> 
</html > 


将 文件 保存 到 d:\haobook 文件 夹 中 ,在 浏览 器 地 址 栏 中 输入 该 页 面 的 网 址 : http:// 
127. 0.0.1/book/login. jsp, 即 可 调用 显示 。 页 面 的 执行 情况 分 析 如 下 。 

第 一 次 执行 该 文档 时 ,由 于 URL 中 没有 设置 userName, 并 且 表 单 尚未 生成 ,因此 在 开 
始 处 的 JSP 段 , 执 行 userName 二 request. getParameter("userName") 时 ,参数 userName 
不 存在 ,此 时 会 返回 null( 空 和 字符 串 “null” 不 同 ) ,此 时 ,后 面 的 页 面 重 定位 没有 执行 ,接着 
会 显示 后 面 的 html 代码 ,显示 登录 表单 。 

当 登 录 表单 显示 后 ,如 果 此 时 没有 输入 用 户 名 ,直接 单 击 “ 登 录 ” 按 钮 ,表单 提交 ,执行 
action 设置 中 设置 的 页 面 login. jsp, 即 本 页 面 本 身 。 此 时 表单 已 经 存在 , 即 userName 输入 
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域 已 经 存在 ,此 时 在 开始 处 的 JSP 代码 段 , 读 取 的 userName 不 再 是 null, 而 是 空 字符 ("")， 
即 userName 此 时 为 空 字 符 , 即 "". equals(userName) 条 件 为 真 。 

【 例 6-10】 编写 JSP 代码 ,显示 站 点 的 在 线 人 数 。 

分 析 : 显示 在 线 人 数 的 方法 很 多 ,前 面 我 们 看 到 用 application 对 象 可 以 显示 站 点 的 访 
问 人 数 , 但 是 系统 重启 后 ,数据 会 丢失 。 对 于 在 线 人 数 ,利用 Session 对 象 的 数量 可 以 获取 
准确 的 在 线 人 数 。 因 此 ,可 以 编写 一 个 类 来 对 Session 的 创建 和 注销 进行 记录 ,从 而 得 到 在 
线 人 数 的 数据 。 

首先 编写 一 个 统计 会 话 人 数 的 java 类 ,代码 清单 如 下 (文档 名 SessionCounter. java): 


package pub; 
import javax. servlet. *; 
import javax. servlet. http. x ; 
public class SessionCounter implements HttpSessionListener 
{ 
private static int activeSessions = 0; 
public void sessionCreated(HttpSessionEvent se) 
{ 
activeSessionst+; 
} 
public void sessionDestroyed(HttpSessionEvent se) 
{ 
if (activeSessions > 0) 
activeSessions ——; 
} 
public static int getActiveSessions() 
{ 
return activeSessions; 
} 
} 


将 上 述 Java 类 文件 存储 在 Web 应 用 的 用 户 自 定义 类 文件 夹 classes 中 的 pub 包 ( 即 一 
个 子 文件 夹 pub) 中 , 即 存储 到 d:\haobook\WEB-INF\classes\pub 中 ,然后 编译 该 文件 。 
编写 调用 该 SessionCounter. java 的 JSP 文档 ,文档 名 为 myonline. jsp, 内 容 如 下 : 


<% @ page import = "pub. SessionCounter" %> 

<html> 

<head> 

<meta http - equiv = "refresh" content = "60"> 

</head> 

<body> 

在 线 人 数 : <% = SessionCounter. getActiveSessions() %> 
</body> 

</html > 


最 后 ,修改 d:\haobook\WEB-INF\web. xml 配置 文件 ,在 二 web-app 二 …< 一 /web-app 二 元 
素 内 ,添加 如 下 内 容 : 


<! -- Listeners -一 > 
<listener> 
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<listener -class> 
pub. SessionCounter 
</listener -class> 
</listener> 


6.4.5 在 JSP 中 使 用 JavaBean 


JavaBean 主要 应 用 于 JSP 网 页 中 ,通过 JavaBean 可 以 更 好 地 将 业务 逻辑 代码 和 JSP 
的 HTML 标记 进行 分 离 ,便于 系统 的 维护 。 在 JSP 中 使 用 JavaBean ,通常 有 两 种 方法 。 


1. 使 用 二 jsp:useBean 标记 符 访问 JavaBean 
在 JSP 中 ,使 用 二 jsp:useBean> 标记 符 访 问 JavaBean 的 一 般 形式 是 : 


< jsp:useBean id = "实例 名 " class = " 包 . 类 " scope = "page|request| session| application" /> 


其 中 ,id 指定 一 个 JavaBean 类 的 实例 名 ,如 果 这 个 实例 已 经 存在 ,将 直接 引用 这 个 实 
例 ; 如 果 这 个 实例 不 存在 ,将 通过 后 面 class 参数 中 的 定义 新 建 一 个 类 的 实例 。class 参数 
设置 存储 JavaBean 的 路 径 和 类 的 名 称 , 例 如 class 二 "cards. NameCard", 则 表明 要 使 用 Web 
应 用 根 目 录 中 “WEB-INF\classes\cards” 下 的 一 个 NameCard. class 文件 ,其 中 cards 是 包 
名 ,NameCard 为 JavaBean 对 应 的 Java 类 名 。scope 用 于 定义 实例 存在 的 范围 ,事实 上 这 定 
义 了 这 个 实例 所 绑 定 的 区 域 及 其 有 效 范围 。 

(1) page, 这 个 JavaBean 将 存在 于 该 JSP 文件 以 及 此 文件 中 的 所 有 静态 包含 文件 中 ， 
直到 页 面 执行 完毕 为 止 。 

(2) request, 这 个 JavaBean 将 作为 一 个 对 象 绑 定 于 该 页 面 的 request 中 , 即 该 JavaBean 
在 该 页 面 发 出 的 请 求 中 有 效 。 

(3) session ,这 个 JavaBean 将 作为 一 个 对 象 绑 定 于 session 中 , 即 该 JavaBean 在 本 地 有 
效 。 

(4) application ,这 个 JavaBean 将 作为 一 个 对 象 绑 定 于 application 中 , 即 该 JavaBean 
在 本 应 用 中 有 效 。 


2. 嵌入 java 代码 方式 访问 JavaBean 


JavaBean 是 一 个 Java 类 ,在 JSP 中 也 可 以 使 用 导入 (import)Java 类 的 方法 使 用 
JavaBean。 过 程 如 下 。 

(1) 首 行 导 入 JavaBean。 例 如 要 导入 的 JavaBean 为 XXX, 语 句 如 下 : 

<% @ page import = "com. javaBean. XXX" 多 > 

(2) 下 面 就 可 以 像 在 Java 语言 中 一 样 来 使 用 这 个 JavaBean 了 。 例 如 : 

<% XXX obj = new XXX(); 和 > 

【 例 6-11】 编写 一 个 JavaBean, 来 读 取 当 前 系统 的 日 期 和 时 间 ,并 返回 相应 的 字符 串 。 

分 析 : 我 们 编写 一 个 关于 时 间 处 理 的 JavaBean, 关 于 时 间 操 作 是 JSP 中 经 常 使 用 的 
功能 。 
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代码 清单 : mytime. java 


package pub; 
public class mytime 
{ 
public String getDatetime() 
| 
String datestr = ""; 
try{ 
java. text. DateFormat df = new java. text.SimpleDateFormat("yyyy— MM— dd HH:mm") ; 
java. util, Date mydate = new java.util.Date(); 
datestr = df.format(mydate) ; 


catch (Exception ex) { 


} 


return datestr ; 
} 
public String getTime() 
{ 


String timestr = ""; 

try { 
java. text. DateFormat tf = new java. text. SimpleDateFormat( "HH:mm:ss"); 
java. util. Date ud = new java. util. Date(); 
timestr = tf. format (ud); 

} 


catch(Exception ex) { 


} 


return timestr; 
} 

} 

从 上 述 例 子 中 的 mytime 的 定义 可 以 看 出 ,JavaBean 的 定义 并 没有 那么 严格 ,可 以 没有 
属性 ,属性 也 不 一 定 都 要 有 set 和 get 方法 。 

在 Web 应 用 中 ,用 户 定义 的 类 或 JavaBean 通常 存储 在 根 目录 下 的 “WEB-INF\classes\ 
包 \” 文 件 夹 中 ,Java 通过 包 来 实现 用 户 类 定义 的 分 类 存储 和 管理 。 

上 述 JavaBean 应 存储 在 Web 应 用 特定 的 文件 夹 中 , 即 Web 应 用 根 目 录 中 “WEB-INF\ 
classes\pub” 下 ,用 javac mytime. java 编译 生成 mytime. class, 该 文件 将 存储 在 pub 包 中 ， 
即 pub 子 文件 夹 中 。 

【 例 6-12】 编写 一 个 JSP 页 面 ,使 用 例 6-11 中 定义 的 JavaBean 以 及 例 6-4 中 定义 的 
JavaBean, 即 NameCards。 

分 析 : JavaBean 主要 应 用 在 JSP 页 面 中 ,通常 通过 一 jsp:useBean 过 标记 来 应 用 。 调 用 
JavaBean 很 简单 。 下 面 的 代码 演示 了 例 6-11 和 例 6-4 中 定义 的 两 个 JavaBean 在 一 个 JSP 
文档 中 的 使 用 。 

代码 清单 : mybeans. jsp 

<%@ page contentType = "text/html;charset = GBK" %> 


<%(@ page language = "java" %> 
< jsp:useBean id= " mycard " class = "cards. NameCard" scope = "application" /> 
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< jsp:useBean id= "mytime" class = "pub. mytime" scope= "application" /> 
<html> 
<body> 
<% 
mycard. setName( "Hao XW"); 
mycard. setAddress( "No. 27 Shanda South Road, Jinan, China" ); 
%> 
姓名 : <% = mycard. getName()%><br> 
地 址 : <% = mycard. gethddress() %>< br> 
日 期 : <% = mytime. getDatetime(). substring(0,16) %><br> 
</body> 
</html > 
在 上 述 的 JSP 页 面 中 ,调用 了 一 个 JavaBean, 即 cards. NameCard。 将 上 述 JSP 文档 保 
存 到 Web 应 用 的 主 目录 下 ,然后 在 浏览 器 地 址 栏 中 输入 http://127. 0. 0. 1/book/mycard. 


jsp, 则 浏览 器 将 显示 运行 结果 。 


6.5 JDBC 与 数据 库 编程 
A 


在 计算 机 应 用 软件 中 ,数据 的 存储 可 分 为 文件 和 数据 库 两 种 模式 。 一 般 的 应 用 软件 , 例 
如 Word、Excel、Photoshop、Flash 等 ,都 有 注册 的 文档 类 型 ,采用 特定 格式 的 文件 存储 数 
据 。 在 Web 应 用 中 ,通常 使 用 数据 库 来 存储 和 管理 系统 数据 。 为 了 实现 应 用 系统 和 数据 库 
管理 系统 的 相对 独立 ,应 用 系统 通过 相应 的 数据 接口 来 访问 和 操作 数据 库 。 


6.5.1 JDBC 接口 及 其 安装 和 配置 


Java 中 连接 数据 库 的 技术 是 JDBC(Java DataBase Connectivity) ,通过 java. sql 包 中 的 
类 接口 和 异常 事件 ,可 以 对 数据 库 进行 操作 。 在 JDK 中 ,java. sql 包 定义 了 访问 数据 库 的 
接口 和 类 ,但 是 JDBC API 不 能 直接 访问 数据 库 ,必须 依赖 于 数据 库 厂商 提供 的 针对 其 具体 
的 数据 库 产品 的 JDBC 驱动 程序 。 大 多 数 的 数据 库 管理 系统 都 带 有 和 Java 相配 的 JDBC 驱 
动 程序 ,Java 程序 通过 JDBC 驱动 程序 即 可 实现 与 数据 库 的 连接 ,执行 查询 .提取 数 据 等 操 
作 ,使 得 Java 程序 能 访问 诸如 Oracle、MS SQL Server、MySQL 和 MS Access 等 数据 库 。 


1. JDBC 驱动 的 安装 和 配置 


要 使 用 JDBC 驱动 ,首先 要 在 系统 中 进行 安装 和 配置 。 在 Web 应 用 中 , WEB-INF\ 文 
件 夹 中 包括 classes 子 文件 夹 和 lib 子 文件 夹 , 其 中 classes 文件 夹 存储 用 户 定义 的 类 ,lib 文 
件 夹 存储 应 用 系统 所 需要 的 驱动 程序 包 . jar 文件 。 

在 WEB-INF\classes 文件 夹 下 ,可 以 进一步 再 定义 一 些 子 文件 夹 ( 即 用 户 包 ), 用 于 存 
储 用 户 定义 的 Java 类 和 JavaBean 源 文件 和 . class 文件 ,例如 ,定义 WEB-INF\classes\pub 
文件 夹 下 ,存储 关于 数据 库 操作 的 JavaBean。 

对 于 数据 库 的 JDBC 驱动 应 复制 到 WEB-INF\lib 文件 夹 中 ,驱动 程序 可 以 从 网 上 查找 
并 下 载 ,例如 : MS SQL Server 2005 的 驱动 为 sqlidbc. jar。 最 后 ,在 系统 环境 变量 的 
classpath 中 添加 驱动 所 在 的 目录 ,在 classpath 设置 的 后 面 ,添加 下 面 的 路 径 ; 用 户 系 统 所 
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在 的 驱动 器 : 根 目录 \WEB-INF\lib\, 例 如 : d:\haobook\WEB-INF\lib\。 
2. 数据 库 访问 相关 的 类 


JDBC API 主要 位 于 java. sql 包 中 ,java. sql 包 定义 了 所 有 的 JDBC 应 用 相关 的 类 和 方 
法 。 常 用 的 类 和 接口 如 下 。 

(1) java. sql. DriverManager 类 : 主要 用 于 处 理 JDBC 驱动 程序 的 调 入 ,并 且 对 新 的 数 
据 库 连 接 提 供 支持 。 常 用 方法 如 下 。 

@ getConnection(String url, String user,String pwd) ,建立 和 数据 库 服务 器 程序 的 连 
接 , 返 回 一 个 Connection 类 对 象 。 

其 中 , url 是 指 要 连接 的 数据 库 名 ,例如 :“jdbc: sqlserver://localhost: 1433; 
DatabaseName 一 gsl_messageboard”,user 和 pwd 对 应 该 数据 库 服务 器 的 用 户 名 和 密码 。 
可 以 通过 数据 库 服务 器 的 管理 界面 得 到 。 

@ setLoginTimeOut(int seconds) , 设 定 等 待 数据 库 服务 器 连接 的 最 长 时 间 。 

@ setLogWriter(PrintWriter out) , 设 定 输入 数据 库 日 志 的 PrintWriter 对 象 。 

(2) java. sql. Connection 类 : 代表 和 数据 库 的 连接 ,用 户 通过 该 对 象 操作 特定 的 数据 
库 。 常 用 方法 如 下 。 

O@ getMetaData() ,返回 数据 库 的 MetaData 数据 。MetaData 数据 包含 了 数据 库 的 相 
关 信 息 , 例 如 : 当前 数据 库 连接 的 用 户 名 、 使 用 的 JDBC 了 驱动 程序 、 数 据 库 允许 的 最 大 连接 
数 ,数据库 的 版 本 等 。 

@ createStatement() ,创建 并 返回 一 个 Statement 类 对 象 。 

@ PrepareStatement(String sql) ,创建 并 返回 prepareStatement 对 象 。 

在 实际 应 用 中 ,我 们 会 遇 到 同时 提交 多 个 SQL 语句 ,这 些 SQL 语句 要 么 全 部 成 功 ,要 
么 全 部 失败 ,如 果 其 中 一 条 提交 失败 , 则 必须 撤销 整个 事务 。 为 此 ,Connection 类 还 提供 了 
3 个 控制 事务 的 方法 。 

@ setAutoCommit(boolen autoCommit) ,设置 是 否 自动 提交 事务 ,默认 为 自动 提交 。 

@ commit() ,提交 事务 。 

@ rollback() ,撤销 事务 。 

(3) java. sql. Statement 类 : 用 来 执行 静态 SQL 语句 。 例 如 ,调用 executeQuery 
(CString sql) 方 法 可 以 执行 select 语句 ,并 返回 一 个 ResultSet 类 对 象 , 保 存 了 查询 结果 数据 
集 。 调 用 executeUpdate(String sql) 方 法 可 以 执行 insert、update、delete 语句 , 即 进行 数据 
记录 的 插入 、 修 改 和 删除 操作 。 

(4) java. sql. PrepareStatement 类 : 用 于 执行 动态 的 SQL 语句 , 即 允 许 SQL 语句 中 包 
含 参数 。 使 用 方法 为 : 

String sql = "SELECT coll FROM tablename WHERE col2 = ? RND col3=? "; 

PrepareStatement perpStmt = conn.preparestatement(sql); 

perpStmt. setString(1, col2Value); 


perpStmt. setFloat(2, col3Value); 
ResultSet rs = perpStmt. executeQuery(); 


(5) java. sql. ResultSet 类 : 用 来 保存 select 语句 查询 得 到 的 记录 集 , 用 它 可 以 浏览 和 
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存 取 数据 库 内 的 记录 。 一 个 Statement 对 象 在 同一 时 刻 只 能 打开 一 个 ResultSet 对 象 。 

通过 ResultSet 的 getXXX() 方 法 来 得 到 字段 值 , ResultSet 提供 了 getString()、 
getFloat() .getInt() ,getTime() 等 方法 。 可 以 通过 字段 的 序号 或 者 字段 的 名 字 来 指定 要 获 
取 的 某 个 字段 的 值 。 在 上 例 中 ,使 用 getString(0) ,getString("coll") 都 可 以 获得 字段 coll 
的 字符 串 值 ,通过 Integer 对 象 可 以 将 字符 串 值 转换 为 整数 。 

有 些 字段 可 以 使 用 不 同 的 方法 返回 值 , 但 返回 值 的 类 型 可 以 不 同 , 例 如 对 于 一 个 int 字 
段 , 可 以 使 用 getString() 和 getInteger() 来 获取 字段 的 值 , 但 前 者 返回 一 个 字符 串 ,后 者 则 
返回 一 个 整数 值 。 再 如 : 对 于 一 个 Datetime 型 字段 ,可 以 使 用 getString () 、getDate()、 
getTime() 返 回 数据 ,但 返回 数据 的 类 型 不 同 。 因 此 ,在 选择 get 方法 提取 数据 字段 值 时 ,应 
根据 程序 的 需要 选择 相应 的 方法 ,可 以 节省 数据 类 型 转换 。 


6.5.2 结构 化 查询 语言 基础 


结构 化 查询 语言 (Structured Query Language,SQL) 是 关系 数据 库 管 理 系统 的 标准 语 
言 , 用 于 存 取 数 据 以 及 查询 .更 新 和 管理 关系 数据 库 系 统 。 不 同 的 关系 数据 库 使 用 的 SQL 
版 本 有 一 些 差异 ,但 大 多 数 都 遵循 ANSI SQL 标准 。 


1. SQL 的 组 成 与 T-SQL 


SQL 语言 包含 三 部 分 。 

(1) 数据 定义 语言 (Data Definition Language,DDL): 用 于 定义 关系 数据 库 的 模式 、 外 
模式 和 内 模式 ,以 实现 对 数据 库 基 本 表 、 视 图 及 索引 文件 的 定义 、 修 改 和 删除 等 操作 。 常 用 
的 DDL 语句 是 CREATE .DROP 和 ALTER 命令 。 

(2) 数据 操作 语言 (Data Manipulation Language,DML): 用 于 完成 数据 查询 和 数据 更 
新 操作 。 其 中 数据 更 新 指 对 数据 进行 插入 、 删 除 和 修改 操作 。 常 用 的 DML 语句 是 
SELECT INSERT、UPDATE 和 DELETE 命令 。 

(3) 数据 控制 语言 (Data Control Language,DCL) : 用 于 控制 对 数据 库 的 访问 ,服务 器 
的 关闭 .启动 等 操作 。 常 用 的 DCL 语句 有 GRANT 、REVOKE .COMMIT ROLLBACK 等 
命令 。 

在 实际 应 用 中 ,使 用 较 多 的 是 TransactrSQL(T-SQL) , 它 是 微软 遵循 ANSI SQL-92 标 
准 在 Microsoft SQL Server 系统 中 使 用 的 语言 。Transact-SQL 分 成 五 部 分 , 即 数据 定义 语 
言 .数据 操纵 语言 ,数据 控制 语言 .事务 管理 语言 和 附加 的 语言 元 素 。 其 中 ,附加 的 语言 元 素 
主要 包括 标识 符 、 变 量 和 常量 、 运 算 符 、 表 达 式 ,数据 类 型 .函数 ,控制 流 语言 .错误 处 理 语言 、 
注释 等 。 在 T-SQL 中 ,定义 了 大 量 的 标准 函数 ,涉及 聚合 函数 ,数学 函数 、 字 符 串 函数 \ 日 期 
和 时 间 函 数 、 系 统 函 数 、 游 标 函 数 和 元 数据 函数 ,这 就 给 了 SQL 以 强大 的 编程 能 力 。 关 于 这 
些 函数 的 定义 及 功能 ,超出 本 书 的 写作 范围 ,请 参考 专门 的 T-SQL 书籍 。 


2. 简单 数据 查询 


查询 语句 用 来 对 已 经 存在 于 数据 库 中 的 数据 按照 特定 的 组 合 、 条 件 表达 式 或 者 一 定 次 
序 进行 检索 。SELECT 语句 的 完整 语法 较 复杂 ,其 主要 子 句 可 归纳 如 下 : 


第 6 章 ”服务 端 编程 “357 
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SELECT < select list> 

[INTO < new_table> ] 

FROM < table_source> 

[WHERE < search_condition> ] 

[GROUP BY < group by expression> ] 

[HAVING < search condition> ] 

[ORDER BY < orderby_expression> [ASC | DESC]] 

[COMPUTE { {AVG | COUNT | MAX | MIN | SUM } (expression) } [ BY expression]] 


在 SQL 中 ,Select 语句 非常 复杂 ,但 常用 的 子 句 主 要 是 SELECT、FROM 和 WHERE 
子 句 。SELECT 子 句 用 于 指定 将 要 查询 的 列 名 称 ,FROM 子 句 指定 这 些 数 据 来 自 哪些 表 或 
视图 ,WHERE 子 句 则 用 于 指定 数据 应 该 满足 的 条 件 。 在 一 般 的 检索 中 ,SELECT 子 句 和 
FROM 子 句 是 必 不 可 少 的 。 

1) SELECT 子 句 

SELECT 子 句 的 功能 是 指定 要 查询 的 结果 列 。 其 语法 格式 如 下 : 


SELECT [ ALL | DISTINCT ] [ TOP <n> [ PERCENT ] ] < select list> 


其 中 select_list 定义 为 : 


<select list>::={* 
| {table name | view name | table alias }.* 
| {column name | expression } [ [ AS ] column alias ] 
| column alias = expression 
} 
各 参数 说 明 如 下 。 


(1) ALL: 返回 结果 集中 的 所 有 行 ,是 系统 默认 值 。 

(2) DISTINCT: 指明 结果 集中 如 果 有 值 相同 的 行 , 则 只 显示 其 中 的 一 行 ; 对 于 
DISTINCT 关键 字 来 说 ,Null 值 是 相等 的 。 

(3) TOP<x> [ PERCENT ]: 指明 仅 返 回 结果 集中 的 前 4 行 ,如 果 有 [ PERCENT ], 则 
返回 结果 集中 的 百 分 之 n 行 记录 。 

对 于 select_list, 指 定 要 查询 的 结果 列 ,结果 列表 是 以 逗号 分 隔 的 一 系列 表达 式 。 

(4) * : 表示 返回 在 FROM 子 句 中 包括 的 所 有 对 象 的 全 部 列 ,这 些 列 按 FROM 子 句 
中 指定 的 表 或 视图 顺序 返回 ,并 对 应 于 它们 在 表 或 视图 中 的 顺序 。 

(5) { table_name | view_name | table_alias }. * : 指明 返回 指定 表 或 视图 的 全 部 列 。 

(6) column_name: 指明 返回 的 列 名 。 

(7) expression: 是 一 个 由 列 名 、 常 量 、 函 数 通过 操作 符 连 接 起 来 的 数据 表达 式 , 作 为 返 
回 结果 集中 的 一 列 。 

(8) column_alias: 指明 用 以 代替 出 现在 结果 集中 的 列 名 或 表达 式 的 别名 。 

【 例 6-13】 假定 有 一 个 数据 表 student, 存 储 学 生 的 简单 信息 ,包含 的 字段 有 sno、 
sname、ssex\sdept\sbirthday, 对 数据 进行 基本 查询 。 

分 析 : 本 题 在 于 练习 SELECT 子 句 的 不 同 应 用 ,进一步 理解 各 个 参数 的 含义 和 功能 。 

查询 1: 查询 所 有 学 生 的 详细 信息 。 查 询 语句 为 : 
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™ 
SELECT sno, sname, ssex, sdept, sbirthday FROM student 
或 
SELECT 关 FROM student 
查询 2: 查询 有 过 选课 记录 的 学 生 的 学 号 ,消除 取 值 重复 的 行 。 查 询 语 句 为 : 
SELECT DISTINCT sno FROM sc 
查询 3: 查询 所 有 学 生 的 编号 、 姓 名 和 所 在 系 ,并 修改 结果 集中 列 的 名 称 。 语 名 如 下 : 
SELECT ' 学 号 '= sno，' 姓 名 ' = sname, sdept AS ' 院 系 'FROM student 


2) WHERE 子 句 与 条 件 查询 
查询 满足 指定 条 件 的 记录 可 以 通过 WHERE 子 句 实现 。WHERE 子 句 指定 数据 检索 
的 条 件 , 以 限制 返回 的 数据 行 。 其 语法 格式 如 下 : 


WHERE < search_condition> 
search_condition 用 于 指定 查询 条 件 。WHERE 子 句 中 常用 的 查询 条 件 如 表 6-6 所 示 。 
表 6-6 常用 的 查询 条 件 


查询 条 件 谓 词 

比较 本 
确定 范围 BETWEEN ANDNOT BETWEEN AND 
确定 集合 IN.NOT IN 

字符 匹配 LIKE.NOT LIKE 

空 值 IS NULL.IS NOT NULL 

多 重 条 件 AND.OR、NOT 


使 用 谓词 LIKE 进行 字符 串 的 匹配 ,其 一 般 的 语法 格式 如 下 : 
[ NOT ] LIKE '< 匹 配 串 >' 


其 含义 是 查找 指定 的 属性 列 值 与 二 匹配 串 二 相 匹 配 的 记录 。 王 匹配 串 志 可 以 是 一 个 完 
整 的 字符 串 , 也 可 以 含有 通配符 。 在 SQL Server 中 ,有 如 表 6-7 所 示 的 四 种 通配符 。 


表 6-7 通配符 
通配符 功 能 示 例 
% 代表 零 或 多 个 字符 "sn%" ,表示 "sn" 后 可 接任 意 字 符 串 
= 代表 一 个 任意 字符 "s_n" ,表示 "s" 与 "n" 之 间 可 以 有 一 个 字符 
口 表示 在 某 一 范围 内 的 字符 [1-9], 表 示 1 一 9 之 间 的 字符 
[J 表示 不 在 某 一 范围 内 的 字符 [^1-9], 表 示 不 在 1 一 9 之 间 的 字符 


需要 注意 的 是 ,如 果 使 用 WHERE 子 句 来 限制 查询 的 范围 ,WHERE 子 句 必须 紧 跟 在 
FROM 子 名 之后。 下面 是 一 组 简单 的 条 件 查询 例子 。 

【 例 6-14】 使 用 条 件 查询 ,对 上 述 例子 中 的 数据 表 进 行 查询 。 

查询 1: 查询 性 别 为 “ 女 ” 的 学 生 的 学 号 、. 姓 名 和 系 别 。 
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SELECT sno, sname, sdept 
EROM student 
WHERE ssex = N' 女 ' 


查询 2: 查询 成 绩 在 80 一 100 之 间 的 学 生 及 课程 信息 。 


SELECT * FROM sc 
WHERE grade BETWEEN 80 AND 100 


查询 3: 查询 出 生日 期 不 在 1990 一 1992 年 之 间 的 学 生 的 姓名 ,性 别 和 所 属 系 。 


SELECT sname, ssex, sdept 
FROM student 
WHERE sbirthday NOT BETWEEN '1990— 01— 01'AND '1992— 01— 01' 


查询 4: 查询 信 管 系 、 会 计 系 、 营 销 系 学 生 的 姓名 和 性 别 。 


SELECT Sname, Ssex 
FROM Student 
WHERE Sdept IN ( N' 信 管 系 ', N' 会 计 系 ',N' 营 销 系 '); 


查询 5: 查询 姓 “ 张 "的 学 生 姓 名 。 


SELECT sname 
FROM student 
WHERE sname LIKE N' 张 名 ' 


查询 6: 查询 信 管 系 的 女生 的 学 号 、 姓 名 。 


SELECT sno, sname 

FROM student 

WHERE sdept = N' 信 管 系 ' AND ssex = N' 女 ' 

3) ORDER BY 子 句 与 排序 输出 

用 ORDER BY 子 句 对 查询 结果 按照 一 个 或 多 个 属性 列 的 升序 (ASC) 或 降序 (DESC) 


排列 , 空 值 被 视 为 最 低 的 可 能 值 。 


例如 : 查询 所 有 男生 的 学 号 、 姓 名 和 出 生日 期 ,并 按照 出 生日 期 降序 排列 ; 若 出 生日 期 


相同 , 则 按 学 号 升序 排列 。 则 SQL 语句 为 : 


SELECT sno, sname, sbirthday 
FROM student 

WHERE ssex= N' 男 ' 

ORDER BY sbirthday DESC, sno 


3. 聚合 查询 


聚合 查询 是 指 通过 查询 对 一 组 数据 进行 聚合 运算 得 到 聚合 值 的 过 程 。 在 聚合 运算 中 主 


要 是 使 用 聚合 函数 。SQL Server 中 提供 了 许多 聚合 函数 ,常用 的 聚合 函数 见 表 6-8。 


在 Microsoft SQL Server 2005 中 ,可 以 在 三 个 子 句 中 使 用 聚合 函数 , 即 SELECT 子 句 、 


COMPUTE 子 句 和 HAVING 子 句 ,在 此 先 介 绍 如 何在 SELECT 子 句 和 COMPUTE 子 句 
中 使 用 聚合 函数 。 
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表 6-8 常用 的 聚合 函数 


函 数 功 能 
COUNT([DISTINCT | ALL]*) 统计 记录 个 数 
COUNT([LDISTINCT | ALL]< 列 名 >) 统计 一 列 中 值 的 个 数 
SUM([DISTINCT | ALL]< 列 名 之 ) 计算 一 列 值 的 总 和 (此 列 必须 是 数值 型 ) 
AVG([DISTINCT | ALL]<< 列 名 之 ) 计算 一 列 值 的 平均 值 ( 此 列 必须 是 数值 型 ) 
MAX([DISTINCT | ALL]< 列 名 >>) 求 一 列 值 中 的 最 大 值 
MIN([DISTINCT | ALL]< 列 名 之 ) 求 一 列 值 中 的 最 小 值 


1) SELECT 子 句 中 的 聚合 

在 SELECT 子 名 中 可 以 使 用 聚合 函数 进行 运算 ,运算 结果 作为 新 列 出 现在 结果 集中 。 
在 聚合 运算 的 表达 式 中 可 以 包括 列 名 、 常 量 以 及 由 算术 运算 符 连接 起 来 的 函数 。 下 面 是 一 
组 使 用 聚合 查询 的 示例 。 

查询 1: 统计 所 有 的 学 生 人 数 。 

SELECT COUNT( * ) RS 学 生 人 数 

FROM student 

查询 2: 统计 有 选课 记录 的 学 生 人 数 。 

SELECT COUNT(DISTINCT sno) AS 有 选课 记录 的 学 生 人 数 

FROM sc 


查询 3: 统计 选修 “c01” 课 程 的 平均 成 绩 、 最 高 成 绩 和 最 低 成 绩 。 


SELECT AVG(grade) AS c01 课程 的 平均 成 绩 ， 
MAX(grade) AS c01 课程 的 最 高 成 绩 ， 
MIN(grade) AS c01 课程 的 最 低 成 绩 

FROM sc 

WHERE cno = 'c01' 


2) COMPUTE 子 句 中 的 聚合 

在 SELECT 子 句 中 出 现 聚 合 函数 时 ,结果 集中 的 数据 全 是 聚合 值 ,没有 明细 值 。 
COMPUTE 子 名 不仅 可 以 使 用 聚合 函数 计算 聚合 值 , 而 且 可 以 依然 保持 原 有 的 明细 值 , 新 
的 聚合 值 作为 附加 的 汇总 列 出 现在 结果 集 的 最 后 。 需 要 注意 的 是 ,如 果 是 用 COMPUTE 
子 句 指定 的 行 聚合 函数 , 则 不 允许 它们 使 用 DISTINCT 关键 字 。 

例如 : 查询 信 管 系 学 生 的 学 号 、 姓 名 和 年 龄 ,最 后 汇总 出 该 系 学 生 的 总 人 数 和 平均 
年 龄 。 

SELECT sno, sname, year (getdate( ) ) - year(sbirthday) as 年 龄 

FROM student 


WHERE sdept = N' 信 管 系 ' 
COMPUTE COUNT( sno), AVG( year(getdate( ) ) - Year(sbirthday) ) 


4. 分 组 查询 
GROUP BY 子 句 对 查询 结果 按照 一 定 条 件 进 行 分 组 ,分 组 子 句 通常 与 SQL Server 提 
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供 的 聚合 函数 一 起 使 用 。 对 查询 结果 分 组 的 目的 是 细 化 聚合 函数 的 作用 对 象 ,如 果 未 对 查 
询 结果 分 组 , 则 聚合 函数 将 作用 于 整个 查询 结果 ,分 组 后 聚合 函数 将 作用 于 每 一 个 组 ,每 一 
个 组 都 有 一 个 函数 值 。SELECT 语句 后 的 输出 列 只 能 是 聚合 函数 和 分 组 列 。 

如 果 分 组 后 还 需要 按 一 定 的 条 件 对 这 些 组 进行 筛选 ,最终 只 输出 满足 指定 条 件 的 组 , 则 
可 以 使 用 HAVING 子 句 指定 筛选 条 件 。 

例如 : 统计 所 有 被 选 过 的 课程 的 课程 号 及 被 选 过 的 次 数 。 

SELECT cno, count( * ) AS 被 选 次 数 

FROM sc 

GROUP BY cno 

如 果 要 统计 被 选 过 2 次 和 2 次 以 上 的 课程 的 课程 号 及 被 选 过 的 次 数 , 则 需要 使 用 
HAVING 子 句 。 代 码 如 下 : 

SELECT cno, count( * ) RS 被 选 次 数 

FROM sc 


GROUP BY cno 
HAVING COUNT( * )>= 2 


5. 连接 查询 


前 面 的 查询 都 是 针对 一 个 表 进 行 的 , 若 一 个 查询 同时 涉及 两 个 或 两 个 以 上 的 表 , 并 且 每 
一 个 表 中 的 数据 往往 作为 一 个 单独 的 列 出 现在 结果 集中 , 则 称 之 为 连接 查询 。 
FROM 子 句 指定 需要 进行 数据 查询 的 表 , 其 语法 格式 如 下 : 


FROM < table_source > 
其 中 table_source 定义 为 ， 


<table_source>:: = table name[[AS]table alias] | view_name [[AS] view alias] 

| derived_ table [[AS] table alias] 
| < joined table> 

各 参数 说 明 如 下 。 

(1) table_source: 指明 SELECT 语句 所 使 用 的 表 、 视 图 等 数据 源 。 

(2) table_name [ [ AS ] table_alias ]: 指明 表 名 和 表 的 别名 。 

(3) view_name [ [ AS ] view_alias ]: 指明 视图 名 和 视图 的 别名 。 

(4) derived_table [ [ AS ] table_alias ]: 是 从 指定 的 数据 库 和 表 中 检索 的 子 查询 
结果 。 
(5) joined_table: 指明 由 连接 查询 生成 的 查询 结果 作 数 据 源 。 对 于 多 个 连接 ,可 使 用 
圆 括号 来 更 改 连接 的 自然 顺序 。 

根据 多 个 表 返 回 结果 集 的 处 理 不 同 ,连接 查询 又 分 为 以 下 几 种 情况 。 

(1) 交叉 连接 。 交 叉 连 接 不 使 用 任何 连接 条 件 来 限制 结果 集合 ,而 是 对 两 个 数据 源 中 
的 行 以 所 有 可 能 的 方式 进行 组 合 ,也 就 是 做 广义 稍 卡 儿 积 。 交 叉 连 接 在 查询 结果 集中 ,包含 
了 所 连接 的 两 个 表 中 所 有 行 的 全 部 组 合 ,其 结果 的 行 数 等 于 两 个 表 行 数 之 积 , 列 数 等 于 两 个 
表 列 数 之 和 。 
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例如 ,对 student 表 和 course 表 做 交叉 连接 ,可 以 书写 下 面 的 SQL 语句 : 
SELECT student. * ,course. * FROM student, course 

也 可 以 用 JOIN 关键 字 表示 交叉 连接 ,将 上 述 语句 写 为 ; 

SELECT student. x ,course. * FROM student CROSS JOIN course 


(2) 内 连接 。 内 连接 是 用 比较 运算 符 比较 表 中 列 值 ,返回 符合 连接 条 件 的 数据 行 ,从 而 
将 两 个 表 连 接 成 一 个 新 表 。 内 连接 根据 不 同 的 情况 可 分 为 以 下 几 种 。@ 等 值 连 接 : 在 连接 
条 件 中 使 用 等 号 ,通过 相等 的 字段 连接 起 来 的 查询 称 为 等 值 连 接 。@ 自 然 连 接 : 若 在 等 值 
连接 中 ,把 目标 列 中 重复 的 字段 去 掉 则 称 为 自然 连接 。 它 是 一 种 特殊 的 等 值 连接 。@ 非 等 
值 连接 : 表 之 间 的 连接 ,如 果 使 用 除了 “二 ”之 外 的 连接 符 连 接 起 来 的 查询 称 为 非 等 值 连接 。 
虽然 SQL Server 提供 了 非 等 值 连接 查询 ,但 非 等 值 连接 查询 的 例子 很 少 有 实际 应 用 价值 。 
外 自 连接 : 连接 可 以 是 一 个 表 与 其 自身 进行 的 ,这 样 的 连接 称 为 自 连接 。 

【 例 6-15】 假设 有 一 个 学 生 选 课 数据 表 sc, 包 含 sno、cno 和 grade 三 个 字段 。 现 在 要 
求 查询 工商 系 有 选课 记录 的 学 生 的 全 部 信息 以 及 他 们 的 选课 信息 。 

分 析 : 查询 涉及 两 个 数据 表 ,需要 使 用 连接 查询 。 

代码 清单 : 

SELECT student. * ,sc. * 

FROM student, sc 

WHERE student. sdept =N' 工 商 系 ' AND student. sno = sc. sno 

查询 结果 示例 如 下 : 
mo | em | gede| 


国 串 2008002 王 小 惠 女 工商 系 1991.0312000000000 ， 2008002 | c04 830 
加 2008005 张 沾 均 女 工商 系 193307.06 000000000 2008005  c01 950 


【 例 6-16】 如 果 再 增加 一 个 课程 数据 表 course, 包 含 cno .cname 字段 ,查询 信 管 系 选 
修 “C 语言 ?课程 的 学 生 的 姓名 、 课 程 名 和 成 绩 。 

分 析 : 现在 是 三 个 数据 表 的 查询 ,可 以 用 谓词 表示 等 值 连接 ,也 可 以 用 JOIN 关键 字 表 
示 等 值 连接 。SQL 语句 如 下 。 

中 用 谓词 表示 等 值 连接 : 

SELECT sname，cname，grade 

FROM student S，course C，sc 


WHERE S. sno = sc. Sno AND C. cno = sc. cno 
RND sdept = N' 信 管 系 'AND cname = N'C 语言 ' 


@ 用 JOIN 关键 字 表 示 等 值 连接 : 


SELECT Sname, Cname, Grade 

FROM Student S JOIN SC JOIN Course C ON SC. Cno = C. Cno ON S. Sno = SC. Sno 

WHERE sdept = N' 信 管 系 'AND cname = N'C 语言 ' 

(3) 外 连接 。 前 面 内 连接 所 举 的 例子 中 ,连接 的 结果 是 从 多 个 表 的 组 合 中 筛选 出 符合 
连接 条 件 的 数据 ,如 果 数 据 无 法 满足 连接 条 件 . 则 将 其 丢弃 。 但 是 外 连接 则 不 然 , 在 外 连接 
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中 ,不 仅 包括 那些 满足 条 件 的 数据 ,而 且 某 些 不 满足 条 件 的 数据 也 会 显示 在 结果 集中 。 也 就 
是 说 ,外 连接 只 限制 其 中 一 个 表 的 数据 行 , 而 不 限制 另外 一 个 表 中 的 数据 。 这 种 连接 形式 在 
许多 情况 下 是 非常 有 用 的 ,例如 在 连锁 超市 统计 报表 时 ,不仅 要 统计 那些 有 销售 量 的 超市 和 
商品 ,还 要 统计 那些 没有 销售 量 的 超市 和 商品 。 

需要 注意 的 是 ,外 连接 只 能 用 于 两 个 表 中 。 两 个 表 有 主 次 之 分 ,以 主 表 的 每 行 数据 去 匹 
配 从 表 的 数据 列 , 符 合 连接 条 件 的 数据 将 直接 返回 到 结果 集中 ,对 那些 不 符合 连接 条 件 的 列 
将 被 赋予 NULL 值 后 再 返回 到 结果 集中 。 根 据 两 个 表 的 主 次 关系 ,外 连接 分 为 左 外 连接 、 
右 外 连接 、 完 全 外 连接 。 


6. 嵌 套 查询 


一 个 SELECT-FROM-WHERE 语句 称 为 一 个 查询 块 ,有 时 一 个 查询 块 无 法 完成 查询 
任务 ,需要 一 个 子 查询 块 的 结果 作为 父 查询 块 的 条 件 。 将 一 个 查询 块 嵌 套 在 另 一 个 查询 块 
的 条 件 子 句 中 的 查询 称 为 戏 套 查询 。 肉 套 查询 使 我 们 可 以 用 多 个 简单 查询 构成 复杂 的 查 
询 , 从 而 增强 查询 功能 。 

例如 ,查询 选 过 *c01” 号 课程 的 学 生 的 学 号 、 姓 名 和 所 在 系 : 


SELECT sno, sname, sdept 
FROM student 
WHERE sno IN (SELECT sno FROM sc WHERE cno = 'c01') 


7. 组 合 查询 


查询 语句 的 结果 集 往 往 是 一 个 包含 了 多 行 数据 的 集合 。 集 合 之 间 可 以 进行 并 、 交 、 差 等 
运算 。 其 中 ,UNION 运算 符 表示 并 集运 算 ,EXCEPT 运算 符 表示 差 运 算 ,INTERSECT 运 
算 符 表示 交 运 算 。 需 要 注意 的 是 ,在 集合 运算 时 ,所 有 查询 语句 中 列 的 数量 和 顺序 必须 相 
同 , 且 数据 类 型 必须 兼容 。 

例如 ,查询 所 有 的 男生 和 信 管 系 的 学 生 的 姓名 ,性 别 和 所 在 系 , 使 用 UNION 操作 符 , 查 
询 语句 如 下 : 

SELECT sname, ssex, sdept FROM student WHERE ssex = N' 男 ' 


UNION 
SELECT sname, ssex, sdept FROM student WHERE sdept = N' 信 管 系 ' 


8. 数据 的 插入 


在 Transact-SQL 中 ,数据 插入 语句 INSERT 有 两 种 形式 : 一 种 是 插入 一 条 记录 , 另 
种 是 插入 子 查询 结果 。 向 表 中 插入 数据 时 要 注意 ,数字 数据 可 以 直接 插入 ,但 是 字符 数据 和 
日 期 数据 要 使 用 单 引号 (必须 是 英文 半角 输入 状态 下 的 单 引号 ) 引 起 来 。 如 果 是 Unicode 数 
据 ,应 该 在 字符 数据 的 引号 前 使 用 N 字符 (CN 一 定 要 大 写 )。 

1) 插入 一 条 记录 

插入 一 条 记录 的 语法 格式 如 下 : 


INSERT 
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INTO [database name. ] < table name > [ (<column name>[,-…n])] 
VALUES (< constant> [，…n]) 


各 参数 说 明 如 下 。 

(1) database_name: 指定 向 哪个 数据 库 插入 数据 ,如 果 省 略 , 即 指 当前 连接 的 数据 库 。 

(2) table_name: 指定 向 哪个 表 插入 数据 。 

(3) column_name: 表 中 的 列 名 , 当 指 定 VALUES 的 全 部 数据 时 可 省 略 ; 如 果 指 定 了 
column_name, 则 没有 出 现在 子 句 中 的 column_name 将 被 取 NULL 。 

(4) constant: 插 和 人 的 数据 值 。 

例如 ,向 student 数据 表 插入 一 条 记录 ,INSERT 语句 如 下 : 


INSERT INTO student( sno，sname) 
VALUES ('201125011001',，N' 许 宏 ') 


如 果 INTO 子 名 中 没有 任何 列 名 , 则 VALUE 子 句 后 的 列 值 顺 序 必须 与 表 结 构 的 列 顺 
序 一 致 。 

2) 插入 子 查询 结果 

插入 子 查询 结果 的 语句 可 以 将 多 条 满足 条 件 的 记录 添加 到 目的 表 中 , 即 一 次 插入 多 条 
记录 。 插 入 子 查询 结果 的 语法 格式 如 下 : 

INSERT 

INTO [database name. ] < table_name > [ (< column_name> [,…n])] 

SELECT < select_ list> 

各 参数 说 明 如 下 。 

(1) database_name: 指定 向 哪个 数据 库 插入 数据 。 

(2) table_name: 指定 向 哪个 表 插入 数据 。 

(3) column_name: 表 中 的 列 名 。 

(4) select_list: SELECT 查询 结果 。 

例如 ,假设 已 建立 sc_2011 表 , 其 表 结 构 与 sc 表 结构 一 致 。 将 学 号 为 201125011001 的 
学 生 的 各 科 成 绩 添加 到 sc_2008002 表 中 ,插入 语句 如 下 : 

INSERT INTO sc_2011 

SELECT sno, cno, grade 

FROM sc 

WHERE sno = '201125011001' 

需要 注意 的 是 ,标识 字段 可 以 设 定 为 自动 加 1, 此 时 ,在 插入 记录 时 不 能 为 标识 字段 赋 
值 。 还 要 注意 数据 表 的 结构 定义 ,如 果 有 些 字段 不 能 为 空 , 则 插入 记录 时 必须 指定 取 值 。 


9. 修改 数据 记录 


可 以 使 用 UPDATE 语句 更 新 表 中 已 经 存在 的 数据 。UPDATE 语句 可 以 一 次 更 新 一 
行 数 据 、 多 行 数据 ,甚至 可 以 一 次 更 新 表 中 的 全 部 数据 行 。UPDATE 语句 的 语法 格式 如 下 : 


UPDATE [ database name. ] < table name> 
SET {<column name> = <expression>}[ ,…n] 
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[WHERE < search condition >] 


各 参数 说 明 如 下 。 

(1) database_name: 指定 修改 的 数据 所 属 的 数据 库 。 

(2) table_name: 指定 修改 的 数据 所 属 的 表 。 

(3) column_name: 表 中 的 列 名 。 

(4) expression: 用 于 取代 相应 的 属性 列 值 的 表达 式 值 。 

(5) search_condition: 指定 修改 条 件 , 即 修改 符合 条 件 的 列 值 。 若 省 略 WHERE 子 句 ， 
则 将 更 新 表 中 所 有 记录 。 

【 例 6-17】 修改 student 表 中 的 数据 ,将 201125011001 号 学 生 的 名 字 改 为 “ 许 小 雅 ”， 
性 别 改 为 “ 女 ”, 成 绩 加 10 分 。 代 码 如 下 : 

UPDATE student 


SET sname = N' 许 小 雅 '，sname = N' 女 ', grade = grade + 10 
WHERE sno = '201125011001"' 


10. 删除 数据 记录 


使 用 DELETE 语句 可 以 从 表 中 删除 一 行 或 多 行 记录 。DELETE 命令 的 语法 如 下 : 


DELETE FROM [database_name. ] <table name> 

[WHERE < search_condition>] 

各 参数 说 明 如 下 。 

(1) database_name: 指定 删除 记录 的 表 所 属 的 数据 库 。 

(2) table_name: 指定 删除 的 记录 所 属 的 表 。 

(3) search_condition: 指定 删除 条 件 , 即 删除 符合 条 件 的 记录 。 若 省 略 WHERE, 则 默 
认 删 除 所 有 记录 。 

例如 ,要 删除 student 数据 表 中 的 2008 级 所 有 学 生 的 记录 ,语句 为 : 

DELETE FROM student 

WHERE sno LIKE '2008[0 -9][0-9]%" 

假设 学 号 的 编码 规则 是 : 年 级 (4 位 ) 十 专业 (2 位 ) 十 序号 (多 位 ), 条 件 中 的 序号 位 数 
不 确定 。 


6.5.3 数据库 操作 


在 Web 应 用 开发 中 ,通常 需要 对 数据 库 进行 操作 ,包括 数据 库 的 查询 、 修 改 、 插 入 、 删 除 
等 。 对 数据 库 的 操作 ,可 以 直接 在 JSP 页 面 中 完成 ,也 可 以 将 数据 库 操作 编写 成 一 个 
JavaBean, 然 后 在 JSP 页 面 中 调用 。 


1. 数据 库 操作 的 基本 步骤 
对 数据 库 的 操作 ,可 以 分 成 以 下 四 个 基本 步骤 。 
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he 
(1) 加 载 数据 库 驱 动 程序 : 


String sDBDriver = "com.microsoft. sqlserver. jdbc. SQLServerDriver"; 
try { // 加 载 数据 库 驱动 程序 (Microsoft SQL Server 2005) 
Class. forName( sDBDriver). newInstance( ); 


} 
(2) 连接 数据 库 服 务 器 : 


String strConn = "jdbc:sqlserver://localhost:1433;DatabaseName = gsl_messageboard"; 
String strUser = "sa"; 

String strPassword = "sa"; 

Connection conn = null; 

conn = DriverManager. getConnection(strConn, strUser, strPassword); 


(3) 创建 Statement 对 象 , 并 设置 数据 集 游 标 类 型 与 操作 权限 。 
在 执行 具体 的 数据 库 SQL 命令 以 前 ,需要 创建 Statement 对 象 ,并 设置 数据 集 游标 类 
型 与 操作 权限 。 
private java. sql. Statement stmt = null; 
Statement stmt = conn.createStatement(" 游 标 类 型 ", "记录 更 新 权限 "); 
@ 可 设置 的 游标 类 型 : 
。 ResultSet. TYPE_FORWORD_ONLY, 只 可 以 向 前 移动 。 
。 ResultSet. TYPE_SCROLL_INSENSITIVE, 可 卷 动 ,不 受 其 他 用 户 对 数据 库 更 改 
的 影响 。 
。 ResultSet. TYPE_SCROLL_SENSITIVE, 可 卷 动 , 当 其 他 用 户 更 改 数据 库 时 这 个 记 
录 也 会 改变 。 
@ 记录 更 新 权限 : 
。 ResultSet. CONCUR_READ_ONLY ,只 读 。 
。 ResultSet. CONCUR_UPDATABLE, 可 更 新 。 
例如 ,要 对 数据 表 进行 查询 操作 ,语句 为 : 
Statement stmt = conn.createStatement(ResultSet.TYPE SCROLL INSENSITIVE, 
ResultSet. CONCUR_READ ONLY); 
(4) 数据 的 查询 ,插入 修改 与 删除 。 当 stmt 对 象 创建 后 ,即刻 调用 Statement 对 象 的 
executeQuery() 方 法 和 executeUpdate() 方 法 ,利用 SQL 命令 ,来 实现 数据 库 数据 表 的 查 
询 、 插 入 、 修 改 与 删除 操作 。 


2. 数据 库 查询 操作 


在 数据 库 中 查询 数据 ,是 通过 Statement 对 象 的 executeQuery() 方 法 实现 的 ,运行 结果 
返回 一 个 ResultSet 数据 集 。 一 般 形式 如 下 : 

ResultSet rs = stmt. executeQuery( strSQL); 

其 中 ,strSQL 为 一 个 SELECT 形式 的 SQL 命令 ,具体 命令 根据 程序 的 功能 书写 。 命 
令 执 行 结果 为 查询 结果 数据 集 。 然 后 可 以 通过 rs. getString() 等 方法 来 取得 各 个 列 的 数据 。 


1) 在 结果 数据 集中 定位 数据 记录 
如 果 ResultSet 是 可 卷 动 的 ,可 以 使 用 下 列 ResultSet 方法 来 定位 数据 记录 。 
(1) boolean rs. absolute(int row) : 绝对 位 置 ,负数 表示 从 后 面 数 。 


(2) void rs. first() : 将 指针 移动 到 结果 集 对 象 的 第 一 行 。 
(3) void rs. last() : 将 指针 移动 到 结果 集 对 象 的 最 后 一 行 。 
(4) boolean rs. previoust() : 将 指针 移动 到 当前 行 的 前 一 行 。 
(5) boolean rs. next() : 将 指针 移动 到 当前 行 的 下 一 行 。 
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(6) void rs. beforeFirst() : 将 指针 移动 到 结果 集 对 象 的 头 部 , 即 第 一 条 之 前 。 
(7) void rs. afterLast(): 将 指针 移动 到 结果 集 对 象 的 末尾 , 即 最 后 一 条 记录 之 后 。 
(8) boolean rs. isFirst() boolean rs. isLast() boolean rs. isBeforeFirst() boolean rs. 


isAfterLast: 用 于 判断 当前 的 位 置 。 


需要 特别 说 明 的 是 , 刚 打 开 数 据 表 时 ,处 于 第 一 条 记录 之 前 。 


2) 获得 数据 库 数据 
通过 ResultSet 中 的 get 方法 可 以 取得 数据 表 中 当前 记录 的 相应 列 值 。 常 用 的 方法 见 


表 6-9。 
表 6-9 从 ResultSet 中 获取 数据 的 方法 
SQL 类 型 说 明 JSP 类 型 ResultSet 方法 
nchar nvarchar、 ntext Unicode 字符 串 数据 类 型 String String getString(col) 
char varchar ,text 非 Unicode 字符 串 数据 类 型 ”String String getString(col) 
binary .varbinary 二 进 制 字符 串 数据 类 型 、 二 byte[] byte[] getBytes(col) 
进 制 字符 串 数据 类 型 
bit 整数 数据 类 型 , 取 值 为 1.0 Boolean boolean getBoolean( col) 
或 NULL 
tinyint 1B Integer byte getByte( col) 
smallint 2B Integer short getShort(col) 
integer 4B Integer int getInt(col) 
bigint 8B Long long getLong(col) 
decimal[ (m[ ,d])] 定点 小 数 数据 类 型 ,m 是 十 String String getString(col) 
进 制 数字 的 总 个 数 ,d 是 小 数 
点 后 面 的 数字 个 数 
real(m,d) 单 精 度 浮 点 型 ,8 位 精度 (4B) Float float getFloat(col) 
float(m,d) 双 精 度 浮 点 型 , 16 位 精度 Double double getDouble(col) 
(8B) 
datetime 日 期 和 时 间 数 据 类 型 String String getString(col) 
java. util. Date Date java. sql. Date getDate(col) 
money smallmoney 货币 数据 类 型 ,默认 为 2 位 String String getString(col) 


小 数 的 decimal 类 型 。money 
占 8B,smallmoney 占 4B 


在 上 述 关于 数值 的 类 型 中 ,decimal(m,d) 为 定点 小 数 类 型 ,定点 类 型 在 数据 库 中 存放 
的 是 精确 值 。 参 数 m 是 定点 类 型 数字 的 最 大 个 数 ( 精 度 ) ,范围 为 0 一 65,d 是 小 数 点 右 侧 数 
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字 的 个 数 ,范围 为 0 一 30 ,但 不 得 超过 m。 对 定点 数 的 计算 能 精确 到 65 位 数字 。 

浮 点 型 小 数 分 为 单 精度 float 和 双 精 度 double 型 ,参数 m 只 影响 显示 效果 ,不 影响 精 
度 ,d 却 不 同 ,会 影响 到 精度 。 比 如 设 一 个 字段 定义 为 float(5,3), 如果 插 入 一 个 数 
123.45678 ,实际 数据 库 中 存 的 是 123.457 ,小 数 点 后 面 的 数 被 四 舍 五 入 截 成 457 了 ,但 总 个 
数 不 受 到 限制 (6 位 ,超过 了 定义 的 5 位 )。 因 此 ,在 定义 类 似 价格 等 精确 数据 时 ,使 用 浮 点 
型 小 数 时 需要 特别 注意 。 
对 于 SQL 中 的 Datetime 类 型 列 值 ,在 JSP 中 可 以 通过 getString() 取 得 对 应 的 日 期 数 
据 ,并 在 日 期 和 String 之 间 自 动 转换 。 对 于 decimal、money 和 smallmoney 等 数值 型 数据 
字段 ,ResultSet 类 中 没有 对 应 的 getXXX 方法 读 取 数据 表 字 段 的 值 ,可 以 使 用 getString() 
返回 一 个 String 对 象 ,然后 在 String 和 数值 间 转 换 。 
对 于 数据 库 中 longvarchar 和 longvarbinary 类 型 的 数据 字段 ,应 进行 流 操作 ,介绍 略 。 


3. 更 新 数据 库 


对 数据 库 的 更 新 ,可 以 采用 下 述 方法 。 

(1) stmt。 executeUpdate ( " strSql") 方法 : strSql 是 一 条 SQL 更 新 语句 。 执 行 
UPDATE INSERT 和 DELETE 操作 ,返回 影响 到 的 条 数 。 用 户 通 过 返回 值 ,可 以 判断 数 
据 库 操 作 是 否 成 功 。 

例如 : 试图 插入 一 条 记录 ,而 该 记录 的 主 关键 字 已 经 存在 于 数据 表 中 ,此 时 则 返回 0, 即 
插入 不 成 功 。 灵 活 使 用 主 关键 字 定义 可 以 避免 插入 重复 记录 ,而 不 必 在 插入 前 首先 查询 记 
录 是 否 存在 ,节省 操作 时 间 。 

(2) stmt, execute() 方 法 : 在 不 知道 SQL 语句 是 查询 还 是 更 新 的 时 候 使 用 该 方法 。 如 
果 产 生 一 条 以 上 的 对 象 时 ,返回 true, 此 时 可 用 stmt. getResultSet ( ) 和 stmt. 
getUpdateCount() 来 获取 execute 结果 ,如 果 不 返 回 ResultSet 对 象 则 返回 false。 

除了 Statement 的 executeUpdate 之 外 还 可 以 用 ResultSet 来 更 新 数据 库 。 例 如 : 


rs. updateInt(1,10); 
rs. updateString(2, "xxx" ); 
rs. updateRow( ); 


4. 使 用 预 编译 PreparedStatement 


PreparedStatement 对 象 和 Statement 对 象 类 似 , 都 可 以 用 来 执行 SQL 语句 。 但 是 , 通 
过 PreparedStatement 对 象 执行 SQL 语句 的 速度 更 快 。 因 为 ,数据 库 会 对 
PreparedStatement 的 SQL 语句 进行 预 编 译 ,而 且 仍旧 能 输入 参数 并 重复 执行 编译 好 的 查 
询 速度 比 未 编译 的 要 快 。 

例如 : 

PreparedStatement stmt = con. preparedStatement ( " Insert Into users (userid, username) 

values(?,?)"); 

stmt. clearParameters(); 

stmt. setInt(1,2); 


stmt. setString(2, "xxx"); 
stmt. executeUpdate( ); 
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6.5.4 数据 库 编程 举例 


JSP 工 作 在 三 层 结构 的 中 间 层 ,主要 的 功能 是 接收 客户 的 请 求 ,从 数据 库 服 务 器 获得 信 
息 ,然后 以 HTML 的 形式 返 给 客户 浏览 器 。 下 面 举例 说 明 在 JSP 中 访问 Microsoft SQL 
Server 2005 数据 库 的 过 程 。 

【 例 6-18】 编写 一 个 JSP 页 面 ,完成 对 网 站 留言 板 数 据 的 操作 ,包括 留言 .查看 留言 、 
删除 留言 等 。 

分 析 : 在 Web 系统 中 ,通常 设置 留言 板 功能 ,方便 用 户 对 站 点 使 用 中 遇 到 的 问题 或 用 
户 的 意见 和 建议 进行 留言 ,从 而 利于 管理 员 对 站 点 进行 维护 和 改进 。 

具体 操作 步 又 如 下 。 

(1) 创建 留言 板 数据 表 msgboard。 设 在 Web 应 用 系统 中 有 一 个 留言 板 ,供用 户 对 站 
点 进行 留言 ,管理 员 可 以 查看 用 户 留言 并 回复 ,用户 可 以 查看 留言 及 站 点 管理 员 对 留言 的 回 
复 , 也 可 以 删除 自己 的 留言 。 留 言 板 数据 存储 在 站 点 系统 数据 库 gslpub 的 msgboard 数据 
表 中 。 

留言 板 数据 表 msgboard 的 结构 定义 如 图 6-8 所 示 。 

ER ne 工具 C) 窗口 WD 社区 C) 帮助 吕 


总 新村 询 吕 | 六 | 症 六 驴 | 访 | 蕊 轩 铺 | 防 目 队 防 守 电 
i 声 ? 3 间 商 只 回忆 


日 dbo. nsebourd a 
日 国 列 

国 ia Gnt，not mall) 
国 VserID warchar 50), nll) 
Authorliane (avarchar (15), mull) 
国 Title (varchar (50), null) 
国 Nsecontent (nvarchar nex), null 
国 Enail (nvarchar 60), null) 
国 MobilTel (nvarehar (15), nl) 
国 MddTine (datetine, null) 


一 dbo.msghoard 


| 习习 习习 可可 可 


dbo. systemconfig 


国 
国 dbo. Vser_tenp 
la] 


dbo. useraccounts -| 
1 | » 


图 6-8 留言 板 数据 表 msgboard 的 结构 定义 


在 msgboard 数据 表 中 ,不 设置 主 关键 字 , 但 定义 了 标识 字段 id 为 int, 并 且 设 标识 规范 
为 “是 ”, 标 识 增 量 为 1。 在 数据 表 中 ,标识 字段 的 功能 和 主 关键 字 类 似 ,也 可 以 唯一 地 定 为 
一 条 记录 ,但 标识 字段 的 值 不 需要 用 户 输入 或 导入 , 它 的 值 自动 生成 。 主 关键 字 的 取 值 必须 
由 用 户 输入 ,不 能 为 空 ,如 果 要 导入 数据 表 , 也 需要 为 每 条 记录 给 定 主 关键 字 的 值 。 

(2) 为 了 便于 代码 的 重用 ,我 们 定义 一 个 数据 库 操作 的 JavaBean。 在 WEB-INF\ 
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vt 


classes\pub 文件 夹 下 ,创建 一 个 名 为 db_gslpub. java 的 文件 ,定义 一 个 JavaBean, 封 装 有 关 
数据 库 gslpub 操作 中 的 数据 库 连 接 、 查 询 、 数 据 更 新 以 及 断 开 数 据 库 连 接 操 作 。 
代码 清单 : 


package pub; 
import java. sql. *; 
import java. text. *; 
import java. io. *; 
import java. util. *; 
A 
// 连接 gslpub 数据 库 
public class db_gslpub 
{ 
String sDBDriver = "com. microsoft. sqlserver. jdbc. SQLServerDriver"; 
String sConnStr = "jdbc: sqlserver://localhost:1433;DatabaseName = gslpub"; 
String strUser = "sa"; 
String strPassword = "sa"; 
Connection conn = null; 
private java. sql. Statement stmt = null; 
public ResultSet rs = null; 
// 默认 构造 函数 , 加载 JDBC 驱动 程序 
public db_gslpub() 
{ 
try{ 
Class. forName( sDBDriver). newInstance( ); 
} 
catch(Exception e) { 
System. err. println("gslpub conn(): ”+ e.getMessage()); 
} 
} 
// 定义 数据 库 查询 方法 ,返回 查找 的 数据 集 
public ResultSet executeQuery(String sql) 
{ 
rs = null; 
try{ 
conn = DriverManager. getConnection(sConnStr, strUser, strPassword); 
Statement stmt = conn.createStatement(ResultSet.TYPE SCROLL INSENSITIVE, 
ResultSet. CONCUR_READ_ONLY) ; 
rs = stmt.executeQuery(sql); 
} 
catch( SQLException ex) { 
System. err. println("aq. executeQuery: ”+ ex.getMessage()); 
} 
return rs; 
} 
// 定义 修改 数据 库 的 方法 : 插入 、 删 除 、 修 改 操作 
public int executeUpdate( String sql) 
{ 


int returnVal = — 999; 
try{ 
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conn = DriverManager. getConnection(sConnStr, strUser, strPassword); 
Statement stmt = conn.createStatement(ResultSet. TYPE SCROLL SENSITIVE, 
ResultSet. CONCUR_UPDATABLE) ; 
returnVal = stmt.executeUpdate(sql); 
} 
catch( SQLException ex) { 
System. err. println("aq. executeUpdate: ”+ ex.getMessage()); 
} 
return returnVal; 


} 
// 断 开 数 据 库 连 接 
public void disconnectToDB( ) throws java. sql. SOLException 


{ 

if (rs! =null) { 
rs.close(); 
rs = null; 

} 

if (stmt! = nul1) { 
stmt. close( ); 
stmt = null; 

} 

if (conn! =nul1l) { 
conn. close( ); 
conn = null; 


k 


} 

在 Web 开发 中 ,不 建议 在 JSP 中 编写 数据 库 的 访问 程序 。 对 数据 库 的 访问 通常 封装 在 
一 个 JavaBean 中 来 完成 ,这 样 可 以 更 好 地 实现 业务 逻辑 和 JSP 中 HTML 代码 的 分 离 , 同 时 
也 便于 系统 的 维护 ,例如 数据 库 升 级 后 ,原先 的 数据 库 访问 语句 可 能 不 兼容 。 

在 这 个 JavaBean 中 ,在 构造 函数 中 完成 JDBC 驱动 的 加 载 ,另外 定义 了 两 个 公有 
(public) 方 法 来 操作 数据 库 , 即 进行 数据 记录 的 查询 和 更 新 。 最 后 是 一 个 关闭 数据 库 连 接 
的 方法 。 

当 上 述 文件 编辑 完成 后 ,将 db_gslpub. java 文件 保存 ,编译 , 则 在 Web 应 用 根 目录 下 的 
WEB-INF\classes\pub 文件 夹 下 生成 db_gslpub. class 文件 ,该 JavaBean 的 . class 文件 即 
可 在 JSP 页 面 中 被 调用 。 

(3) 在 JSP 中 使 用 JavaBean。 下 面 是 一 个 留言 板 浏 览 页 面 ,文件 名 为 msgboard-list. 
jsp， 其 功能 是 分 页 显示 留言 数据 表 中 的 留言 记录 。 

代码 清单 : msgboard-list. jsp 

<% 四 page contentType = "text/html;charset = gb2312" %> 

<%@ page import = "java. sql. *" %> 

<%@ page import = "java. * " $%> 

< jsp:useBean id= "gslpub" class = "pub. db gslpub" scope= "page"/> 

<%! 

int intpagesize = 10, introwcount, intpagecount, intpage, i; 

String strpage; 
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SA 


ResultSet rs = null; 

%> 

<% 

strpage = request. getParameter("page"); 

if(strpage == nul1) 
intpage = 1; 

else{ 
intpage = java. lang. Integer. parseInt( strpage); 
if(intpage <1) 


intpage = 1; 
} 
%> 
<html xmlns = "http://www. w3.org/1999/xhtml"> 
< head> 


<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312" /> 
< link rel = "stylesheet" type = "text/css" href = "pubcss/mycommon. css"> 
<link rel = "stylesheet" type= "text/css" href = "pubcss/mytable. css"> 
</head> 
<body> 
<table class = "table - hasframe" width = "750" cellpadding = "0" cellspacing = "0" align = 
"center"> 
<tr height = "40"> 
<td class = "table- topic" width= "100% "colspan= "8"x【 留 言 板 ] 用 户 留言 列表 </td> 
<tr> 
<tr height = "35"> 
<td class = "cell - title" width= "5% "> 序号 </td> 
<td class = "cell- title" width= "45% "> 标题 </td> 
<td class= "cell- title" width= "20% "> 日 期 </td> 
<td class = "cell -title" width= "15% "> 留言 人 </td> 
<td class = "cell -title" colspan = "3"> 操 作 </td> 
</tr> 
<% 
try 
{ 
String id, title, msgcontent, addtime, author; 
String hrefl, href2, href3; 
rs= gslpub.executeQuery("SELECT * FROM msgboard ORDER BY AddTime DESC"); 
if(!rs.next()) 
{ 
第 > 
<tr> 
<td class= "cell- title" width= "100%" colspan = "8"> 留 言 板 空 </td> 
</tr> 
<% 
else 


rs. last(); 

introwcount = rs. getRow( ); 

intpagecount = ( introwcount + intpagesize — 1)/intpagesize; 
if( intpage > intpagecount) intpage = intpagecount; 


if(intpagecount > 0) 
{ 
rs.absolute( (intpage — 1) * intpagesize + 1); 
i=0; 
while(i< intpagesize && !rs. isAfterLast()) 
{ 
id= rs. getString("id"); 
title = rs. getString("title"); 
addtime = rs. getString( "addtime"); 
author = rs. getString("authorname" ); 
hrefl = "msgboard - detail. jsp?id = " + id; 
href2 = "msgboard - replay. jsp?id= "+ id; 
href3 = "msgboard - delete. jsp?id= "+ id; 
先 > 
<tr height = "30"> 
<td class = "cell - normal"><$ = (intpage 一 1) * intpagesize +1+i%></td> 
<td class = "cel1 一 normal"><a href ="<% =hrefl %>"><% =title%></a></td> 
<td class = "cell - normal"><$ =addtime% ></td> 
<td class = "cell - normal"><% =author %></td> 
<td class = "cell - normal"><a href = "<% = hrefl%>"> 查 看 </a></td> 
<td class = "cell - normal"><a href = "<% = href2%>"> 回 复 </a></td> 
<td class = "cell - normal"><a href = "<% = href3%>" onclick = "{if(confirm( ' 确 定 要 删除 
吗 ?'") ){return true; }return false; }" target = "_self"> 删 除 </a></td> 


</tr> 
<% 
rs. next(); 
t+; 
} 
} 
第 > 


<tr height = 30> 


< form name = "forml"”method = "post" action = "msgboard— list. jsp"> 

< td class = "cell - title" colspan = "8"> 第 <% = intpage% > 页 &nbsp; &nbsp; 共 <% = 
intpagecount 多 > 页 
<% 

if(intpage>1) 

{ 
第 > 


"message_list. jsp?page = 1"> 第 一 页 </a> gnbsp; &nbsp; 
message_list. jsp?page =<% = intpage 一 1%>"> 上 一 页 </a> &nbsp; 


<% 
} 
if(intpage < intpagecount) 
%> 
<a href = "message list.jsp?page =<% = intpage + 1%>"> 下 一 页 </a> &nbsp; 
<a href = "message_list. jsp?page =<% = intpagecount % >"> 最 后 一 页 </a> 
<% 


%> 
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< input type = "text" name = "page" value = "0" style = "height:17px;width:20px;"> 
< input type = "submit" value = " 转 到 " style = "height:18px;"> 
</td> 
</form> 
</tr> 
<% 
}//else end 
}//try end 
catch(Exception ex){ 
out. print (ex. getMessage( )); 
} 
finally{ 
rs=null; 
gslpub. disconnectToDB( ); 
} 
%> 
</table> 
</body> 
</html > 


上 述 代码 演示 了 数据 库 在 JSP 中 的 简单 分 页 浏览 ,页 面 中 引用 了 用 户 自 定义 的 样式 表 
文件 ,定义 了 一 组 关于 二 table 宝 和 二 td 二 标记 的 样式 类 。 使 用 样式 类 来 规范 Web 页 面 的 显 
示 是 良好 的 习惯 。 

在 浏览 器 中 ,运行 msgboard-list. jsp 页 面 ,显示 结果 如 图 6-9 所 示 。 


于 http://127.0.0. 1/book/ 


日 " 申 站 | 记 
(Ehttp://127.0.0. 1/book/nseboard-list. jsp 


序号 标题 
1 | 全 用 Towraseript30 疝 制作 一 个 在 网 页 上 可 指 动 的 图 层 2011-11-07 00:00 
2 | 各 条 合用 正 册 表 达 式 进行 数据 有 效 性 给 下 2011-07-17 19:30 


3 | mpavmenw 有 WE? 2011-07-16 00:00 


a | 为 人 么 合用 css? 有 什么 好 处 ? 2011-07-11 00:00 


5 | 如 何 申请 站 点 的 注册 用 户 了 有 什么 特别 权限 2011-05-20 22:20 


入 | 吉 | 村 | 村 | 坦 | 吕 


6 | 在 JavaScript 中 使 用 split 时 ,怎么 选择 分 割 符 2011-05-11 22:10 


第 1 页 共 1 页 


图 6-9 数据库 浏 览 列 表 界 面 


上 述 界面 是 我 们 在 许多 的 Web 应 用 中 见 到 的 用 户 界面 。 在 表格 中 的 每 一 项 的 后 面 都 
有 一 个 “删除 ” 超 链接 , 单 击 该 超 链接 ,可 以 删除 当前 记录 。 对 应 该 超 链 接 的 代码 是 : 
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<a href = "msgboard- delete. jsp?id=<% = id%>" 

onclick = "{if(confirm( ' 确 定 要 删除 吗 ?') ){return true; }return false;}" 

target = "_self"> 删 除 </a> 

针对 上 述 代 码 ,说 明 如 下 。 

(1) 如 果 超 链接 中 有 onclick 事件 , 则 单 击 超 链接 时 ,首先 执行 onclick 对 应 的 函数 ,如 


果 函 数 返回 true, 则 接 下 来 转 到 href 设置 的 页 面 , 如 果 函 数 返 回 false, 则 不 转 到 href 指定 的 
页 面 。 


(2) 每 一 个 超 链接 ,都 会 打开 一 个 窗口 , 设 定 target 一 ”_self", 可 以 保证 打开 的 窗口 覆 


盖 当 前 窗口 。 这 样 在 msgboard-delete. jsp 中 ,删除 记录 后 ,再 通过 response. sendRedirect 
("msgboard-list. jsp") ;来 显示 记录 列表 ,产生 页 面 刷新 的 效果 , 即 可 看 到 删除 后 的 结果 。 


删除 记录 对 应 的 msgboard-delete. jsp 页 面 ,代码 清单 如 下 : 


<%@ page contentType = "text/html;charset = GBK" $%> 
<% @ page import = "java. sql. * " %> 
< 外 @ page import = "java. text. * "第 > 
< jsp:useBean id= "gslpub" class = "pub. db_gslpub" scope = "page"/> 
<% 
String id= request. getParameter("id"); 
if(id== null)// 无 内 容 则 设 为 空 串 
id=""; 
String sqlString = "DELETE FROM msgboard WHERE id= "+ id.trim()+""; 
try{ 
gslpub. executeUpdate( sqlString); 
} 
catch(Exception ex) { 
out. print (ex. getMessage() ); 
} 
finally{ 
gslpub. disconnectToDB( ); 
response. sendRedirect("msgboard— list. jsp"); 
} 
%> 


删除 记录 页 面 是 一 个 纯粹 的 JSP 程序 ,没有 要 显示 的 内 容 ,删除 成 功 后 , 转 回 


msgboard-list, jsp 页 面 , 即 可 看 到 记录 被 删除 的 结果 ,产生 页 面 刷新 效果 。 在 使 用 
response. sendRedirect(Curl) 命 令 时 ,如 果 URL 中 可 以 包含 参数 ,由 于 HTTP 中 文 编码 问 
题 , 中 文 参数 将 不 能 正确 传送 ,可 以 通过 session 和 application 来 传递 。 


在 书写 SQL 命令 串 时 ,特别 是 SQL 中 关键 字 之 间 的 空格 容易 忽视 ,书写 格式 一 定 要 清 


晰 ,以 便于 阅读 和 修改 。 例 如 ,修改 记录 的 SQL 命令 可 以 书写 为 : 


String strSQL = "UPDATE msgboard SET " 

"RuthorName =N'" + 珍妮 + "'," 
"Email ='" + jane@sdu.edu.cn + "'," 
"MobilTel = '" + 135xxxx5123 + "'" 
"WHERE UserID= '" + jane + ""; 


在 执行 修改 命令 以 前 ,可 以 用 下 面 的 语句 来 显示 上 述 的 SQL 命令 串 是 否 正确 : 


+ 十 十 十 


out. println(strSQL + "<br>"); 
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6.6 综合 举例 


在 Web 系统 的 开发 过 程 中 ,虽然 每 个 系统 的 业务 领域 可 能 不 同 ,但 许多 业务 模块 的 程 
序 实 现 是 相似 的 。 本 节选 取 了 笔者 在 项 目 研发 中 遇 到 的 一 些 公共 功能 模块 作为 例子 讲解 ， 
一 则 是 为 了 练习 已 学 的 知识 ,其 次 则 是 为 了 避免 为 了 举例 而 举例 ,举例 内 容 缺 少 实用 性 。 通 
过 来 自 项 目 研发 中 的 例子 ,不 仅 能 更 好 地 讲解 所 学 的 书本 知识 ,还 可 以 将 这 些 例 子 代 码 应 用 
到 实际 项 目的 研发 中 ,为 以 后 的 项 目 研发 提供 借鉴 和 帮助 。 


6.6.1 文件 上 传 操作 


在 许多 Web 应 用 中 ,都 会 用 到 文件 和 文件 夹 操作 ,例如 论文 管理 .作业 提交 等 。 在 基于 
Java 的 技术 中 ,有 关 文 件 和 文件 夹 的 操作 被 封装 在 java. io 包 中 ,下 面 举例 说 明 JSP 中 文件 
( 夹 ) 的 创建 .删除 以 及 文件 的 复制 等 操作 的 实现 。 

【 例 6-19】 有 一 新 闻 公告 发 布 页 面 ,页 面 中 允许 用 户 上 传 附 件 文件 ,并 规定 附件 文件 
的 类 型 ,上 传 的 附件 数量 不 限 , 在 整个 新 闻 公 告 确定 发 布 前 ,可 以 删除 已 经 上 传 的 附件 。 编 
写 相 应 的 JSP 代码 ,实现 文件 上 传 功能 。 

分 析 : 由 于 可 以 上 传 多 个 文件 ,并 且 在 新 闻 公 告 确认 发 布 前 ,允许 删除 上 传 的 附件 , 因 
此 该 页 面 还 应 该 提供 一 个 显示 上 传 附件 的 目标 iframe, 作 为 form 表单 的 target 输出 。 界 面 
设计 如 图 6-10 所 示 。 


信息 类 型 : | [新 闻 公 告 加 
标题 : 
iBITUww|*xi 丘 li 于 村 本 多 人 Lig 人 HOD=Og 避 
字体 |[ -| 大 小 -1 划 ” 知 "| 国庆 代码 


附件 标题 :| 附件 类 型 : 个 疾 图 他 附件 
时 
下 人 文件 : | 文件 名 :| 


LE 
6-10 新 建新 闻 公告 界面 
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在 上 述 界面 设计 中 ,在 “上 传 文件 区域, 每 次 上 传 一 个 文件 ,需要 输入 附件 标题 ; 单 击 
“浏览 ”按钮 ,选择 上 传 的 文件 ; 然后 单 击 * 上 传 ” 按 钮 , 则 将 文件 上 传 到 Web 服务 器 ,此 时 在 
下 面 的 文本 框 中 显示 上 传 的 文件 列表 。 重 复 执行 上 述 过 程 ,可 以 上 传 多 个 附件 。 

在 上 传 区域 的 文件 列表 中 ,每 个 上 传 的 文件 后 面 都 显示 一 个 “删除 ” 超 链接 , 单 击 该 超 链 
接 , 上 传 的 文件 将 从 服务 器 上 删除 。 

实现 上 述 功能 ,需要 三 个 JSP 文 件 ,一 个 是 form 页 面 ,一 个 是 Web 服务 器 端 保存 文件 
页 面 ,还 有 一 个 页 面 负责 删除 上 传 的 文件 。 

(1) 文件 上 传 表单 页 面 news-add. jsp。 从 上 述 的 页 面 设计 可 见 ,由 于 要 实现 多 个 附件 
的 文件 上 传 ,因此 文件 上 传 是 一 个 表单 。 但 是 ,新 建 一 个 新 闻 公 告 ,还 包含 许多 其 他 信息 , 例 
如 标题 ,正文 等 ,这 些 信息 需要 通过 另外 的 表单 来 提交 。 本 处 置 介绍 文件 上 传 涉及 的 代码 
部 分 。 

代码 清单 : news-add. jsp 文件 上 传 涉及 的 界面 核心 代码 


< form name = "form2" method = "POST" action = "news - addfilesave. jsp?delfileflag= 1" 
enctype = "multipart/form— data" target = "filelistbox"> 
< input type = "hidden" name = "newscode" value = "<% = newscode %>"> 
< input type = "hidden" name = "addfilelist" value = ""> 
< input type = "hidden" name = "addfiletitle" value= ""> 
< tr height = "26"> 
<td class = "table_cell" rowspan = "3" align = "right"> 上 传 文件 : </td> 
<td class = "table cell" align = "left"> 
附件 标题 : < input type = "text" name = "showaddfiletitle" size= "47"> 
附件 类 型 : < input type = "radio" name = "addfileflag" value = "插图 "> 插图 
< input type = "radio" name = "addfileflag" value = "附件 " checked> 附 件 
</td> 
</tr> 
<tr height = "26"> 
<td class = "table_cell"> 文件 名 : < span style = "width:340px;overflow:hidden"> 
< input name = "tempstr" value= "" size= 60></span> 
< span style = "width:80px;overflow:hidden"> 
< input type = "file" style = "width: 0px; margin — left: ~ 4px" name = " showaddfile 
onpropertychange = "showfile(this)"></span> 
< input type = "button" value = "上传 " onclick = "Form2DataValid()"> 
</td> 
</tr> 
<tr> 
<td class = "table cell" valign = center align= "left"> 
< iframe name = "filelistbox" width= "98%" height = "45" style= "border:0px solid # 
FFFFFF"> </iframe> 
</td> 
</tr> 
</form> 


在 上 述 代 码 中 ,涉及 两 个 客户 端 函 数 , 即 当 用 户 单 击 “ 浏 览 ” 按 钮 时 ,显示 用 户 选 择 的 文 
件 时 用 到 的 showfile() , 另 一 个 为 单 击 * 上 传 ” 按 钮 时 ,执行 的 数据 有 效 性 验证 和 表单 提交 函 
数 Form2DataValid() 。 
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N\A 
代码 清单 : 


A 
// 在 使 用 < input type = 'file' /> 控件 的 过 程 中 ,不 显示 文件 绝对 路 径 , 被 C:\fakepath\ 代 替 , 避免 
// 服务 器 获取 用 户 端的 真实 路 径 , 以 增强 安全 性 .用 户 可 在 浏览 器 中 设置 , 显示 真实 路 径 
// 参数 obj 为 input file 对 象 
function getPath(obj) 
{ 
if(obj) 
{ 
if (window. navigator. userAgent. indexOf ("MSIE")> = 1) 
| 
obj. select(); 
return document. selection. createRange( ). text; 
} 
if(window. navigator. userAgent. indexOf ("Firefox")>=1) 
{ 
if(obj. files) 
{ 
return obj. files. item(0).getAsDataURL( ); 
} 
return obj. value; 
} 
return obj. value; 
} 
} 
A 
// 显示 文件 真实 路 径 和 文件 名 
function showfile(obj) 
{ 
document. form2. tempstr. value = getPath( obj); 
} 
MAA 
// 表单 Form2 数据 有 效 性 验证 ,提交 
function Form2DataValid(myform) 
{ 
// 附件 标题 验证 
var tmpstr = document. form2. showaddfiletitle. value; 
var tmpflag = false; 
if (tmpstr == "") 
{ 
alert(" 附 件 标题 不 能 为 空 !"); 
document. form2. showaddfiletitle. focus(); 
return false; 
} 
if (tmpstr. indexOf("&")>=0 || (tmpstr. indexOf("#")>=0) 
{ 
alert(" 附 件 标 题 不 能 包含 ? .&、$ 、! 、; 、# 等 字符 "); 
document. form2. showaddfiletitle. focus(); 
return false; 
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if (document. form2. showaddfile. value == "") 
{ 
alert(" 请 先 选 择 文件 "); 
document. form2. showaddfile. focus(); 
return false; 
} 
// 将 附件 文件 列表 存 人 Form2 隐藏 控件 ,从 而 上 传 到 服务 器 端 
var iframestr = document.filelistbox. document.body. innerText; 
if (iframestr. length> 0) 
document. form2.addfilelist. value = iframestr. substring(0, iframestr. indexOf("#")); 
else 
document. form2.addfilelist. value = ""; 
document. form2.addfiletitle. value = document. form2. showaddfiletitle. value; 
// 清空 文本 框 ,以 便 填 加 下 一 个 附件 
document. form2. showaddfiletitle. value = ""; 
//file 的 value 是 只 读 的 , file 的 value 只 能 由 用 户 输入 和 选择 ,不 能 解决 清空 本 次 输入 的 显示 
效果 


document. form2. tempstr. value = ""; 


document. form2. submit( ) ; 
return true; 


. 


(2) 表单 处 理 程序 页 面 news-addfilesave. jsp。 当 单 击 * 上 传 ”按钮 后 ,进行 有 效 性 验证 ， 
最 后 执行 form2. submit() 操 作 , 即 提交 表单 form2 ,此 时 form2 的 action 参数 指定 的 服务 器 
处 理 程序 news-addfilesave. jsp 被 执行 ,进行 文件 上 传 处 理 。 

代码 清单 : 


<% @ page contentType = "text/html;charset = GBK" %> 

<% @ page import = "java. * " %> 

<%@ page import = "java. util. * "%> 

<% @ page import = "com. jspsmart. upload. * " $%> 

< jsp:useBean id = "mySmartUpload" scope = "page" class = "com. jspsmart. upload. SmartUpload" /> 
< jsp:useBean id = "mytime" scope = "page" class = "pub. mytime"/> 

< jsp:useBean id = "gb2312" scope = "page" class = "pub. ISOtoGb2312" /> 
< jsp:useBean id = "workF" scope = "page" class = "pub. fliter" /> 

<% 

String delfileflag = request. getParameter("delfileflag"); 

String newscode = ""; 

String addfileflag= "",addfiletitle="",addfilelist = ""; 

String FileName = "", extname = ""; 

String iframestr = ""; 

String[ ] sl1, s2; 

// Initialization 

mySmartUpload. initialize( pageContext); 

// Only allow txt or htm files 

mySmartUpload. setAllowedFilesList("htm, HTM, , doc, DOC, ppt, PPT, jpg, JPG, gif, GIF, rar, RAR" ); 
// DeniedFilesList can also be used : 

// mySmartUpload. setDeniedFilesList("exe, bat, jsp"); 

// Only allow files smaller than 50000 bytes 
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// mySmartUpload. setMaxFileSize(50000); 
// Upload 
mySmartUpload. upload( ); 
// Save the files with their original names in a virtual path of the web server 
try{ 
// 获 取 表 单数 据 ,与 不 含 上 传 文件 控件 的 Form 获取 方法 request. getParameter 方法 不 同 
Enumeration enumer = mySmartUpload. getRequest().getParameterNames(); 
while( enumer. hasMoreElements( )) 
{ 

String key= (String)enumer.nextElement(); 

String[ ] values = mySmartUpload. getRequest( ) . getParameterValues(key); 

if(key. equals( "addfileflag")) 

{ 

addfileflag = values[0]; 

} 

if(key. equals("addfiletitle")) 

{ 

addfiletitle = values[0]; 

} 

if(key. equals( "newscode" ) ) 

{ 

newscode = values[0]; 

} 

if(key.equals("addfilelist")) 

{ ”// 隐藏 控件 ,存储 已 有 的 上 传 文件 列表 

addfilelist= values[0]; 

} 
A 
// 随 机 生成 文件 名 
String chose = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXY2Z" ; 
char display[ ] = {'0', '0', '0', '0', '0', '0'}, ran[ ] = {"0', '0', '0', '0', '0', '0'}, temp; 
Random rand = new Random( ); 
for(int i=0;i<6;i++) 

{ 

temp = chose. charAt (rand. nextInt (chose. length() ) ) ; 

display[i] = temp; 

ran[i] = temp; 

} 

String random filename = String. valueOf (display); 

random_filename = workF. toHtml (random filename); 

String save_filename = random filename; 
MAA 
// 保 存 上 传 文件 

com. jspsmart. upload. File myFile = mySmartUpload. getFiles().getFile(0); 

FileName = myFile.getFileName(); 

extname = myFile.getFileExt(); 

save filename += "." + extname; 

myFile. saveAs("/mynews/upload/" + newscode + "一 "+ save filename); 
A 
// 输 出 附件 列表 , 即 一 个 html 页 面 ,其 中 页 面 中 "# "以 前 的 部 分 是 页 面 间 传 递 的 数据 
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// 设 定 的 用 于 split 的 分 割 符 
String fl = "\10"; 
String f2 = "\20"; 
if ("".equals(addfilelist)) 
{ 
addfilelist = addfileflag + f2 +addfiletitle + f2 + save filename + fl; 
} 
else 
{ 
addfilelist += addfileflag + f2 +addfiletitle + f2 + save filename + fl; 
. 
iframestr = addfilelist + "#"; 
// 输出 newscode + addfilelist, 以 "# "结尾 的 串 , 该 输出 在 form2 的 target 参数 中 输出 
out. print("< body style = 'margin - top:0pximargin - left:10px; font - size:12px;line— 
height:150 % >"); 
out. print("< span style = 'display:none;'>" + iframestr + "</span>"); 
// 在 iframe 中 输出 附加 文件 列表 ,用 户 可 以 及 时 看 到 新 加 的 附件 列表 
sl = addfilelist. split(f1); 
for (int i=0;i<sl. length;i++) 
{ 
s2= sl[i]. split(£2); 
out. print("[" + (i+1) +"] "+ s2[0] +":"+s2[1] +","+ s2[2]); 
//addfilelist 参数 不 能 在 最 后 , 否则 其 最 后 一 个 文件 的 分 隔 符 "\10" 将 不 能 保存 
out. print("<a style= 'color: # FF0000; text - decoration:none' title = ' 删 除 上 传 的 附 
件 ' href = 'news - addfiledelete. jsp?delfilestr=" +sl[i] + "&delfileflag=" + delfileflag 
+ "gaddfilelist ="+ addfilelist + "gnewscode=" + newscode + ">"); 
out. print("g&nbsp; &nbsp; &times;"); 
out. print("</a>" + "<br>"); 
} 
out. print("</body>"); 
} 
catch (Exception e) { 
out. println("<b> Wrong selection : </b>" + e.toString()); 
} 
%> 


(3) 删除 上 传 文件 页 面 news-addfiledelete. jsp。 在 上 述 页 面 中 ,对 于 已 经 上 传 的 附件 ， 
列表 中 包含 一 个 “删除 ” 超 链接 ,对 应 删除 附件 程序 news-addfiledelete. jsp。 
代码 清单 : 


<% @ page contentType = "text/html;charset = gb2312" %> 

<% @ page language = "java" import = "java. util. * "pageEncoding = "gb2312" %> 
<%@ page import = "java. io. * " %> 

< jsp:useBean id= "gb2312" scope = "page" class = "pub. ISOtoGb2312" /> 

<% 

String newscode = gb2312. convert (request. getParameter ("newscode" ) ) ; 
String addfilelist = gb2312. convert (request. getParameter("addfilelist")); 
String delfilestr = gb2312. convert (request. getParameter("delfilestr")); 
String delfileflag = request. getParameter("delfileflag"); 

String[ ] sl1, s2; 

// 要 删除 的 文件 信息 
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String fl ="\10"; 
String f2 = "\20"; 
s1 = delfilestr. split(f2); 
String delfilename = newscode+ "一 "+sl[2]; 
// 求 要 删除 的 文件 对 应 的 串 在 总 的 串 中 的 位 置 
delfilestr = delfilestr + f1; 
int pos = addfilelist. indexOf(delfilestr); 
if (pos>-1) 
' 
addfilelist = addfilelist. substring(0, pos) + addfilelist. substring(pos + delfilestr. length( )); 
} 
// 如 果 所 有 文件 被 删 空 
String iframestr; 
if (addfilelist. length()>0) 
iframestr = addfilelist + "#"; 
else 
iframestr = ""; 
// 输 出 新 的 addfilelist, 没 有 附件 时 只 有 newscode, 以 便 添加 新 的 附件 
out. print("< body style = 'margin — top: Opx;margin — left:10px; font - size: 12px; line - height: 
150% >"); 
out. print("< span style = 'display:none;'>" + iframestr + "</span>"); 
// 显 示 新 的 文件 列表 ,如 果 没 有 附件 , 则 只 有 newscode, 以 便 添加 新 的 附件 
if (addfilelist. length()>0) 
[ 
sl = addfilelist. split(f1); 
for (int i=0;i<sl.length;i++) 
{ 
s2= sl[i]. split(f2); 
out. print("[" + (i+1) +"] "+ s2[0] +":"+s2[1]+","+ s2[2]); 
out. print("<a style = 'color: # FF0000; text - decoration:none' title = ' 删 除 上 传 的 附件 ' 
href = 'news — addfiledelete. jsp?delfilestr =" +sl[i] + "&delfileflag=" + delfileflag + 
"gaddfilelist ="+ addfilelist + "gnewscode=" + newscode + ">"); 
out. print("gnbsp; gnbsp; &times;" ); 
out. print("</a>" + "<br>"); 
} 
} 
out. print("</body>"); 
// 在 修改 操作 时 ,不 真正 的 删除 文件 ,只 有 “确认 ”再 删除 ,此 时 从 物理 上 删除 文件 
if ("1".equals(delfileflag)) 
{ 
String mypath = request. getRealPath(""); 
mypath += "\\mynews\\upload\\"; 
File f =new File(mypath, delfilename); 
if(f.exists()) 
{ 
f. delete();// 删 除 文件 
} 
} 
%> 


关于 新 闻 公 告 的 其 他 信息 处 理 , 包 括 页 面 内 容 编辑 .表单 数据 提交 、 数 据 库 操作 等 将 在 
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6. 6. 2 节 介 绍 。 


6.6.2 多 表单 数据 处 理 


下 面 介绍 内 容 输入 表单 forml ,和 页 面 底部 的 “确定 ”“ 取 消 " 按 钮 。 用 于 上 传 全 部 数据 
的 表单 form3, 还 有 一 个 单独 用 于 “取消 ”按钮 的 表单 ,其 目的 是 删除 已 经 上 载 的 附件 。 


1. 内 容 编 辑 用 表单 form1 定义 


在 页 面 的 顶部 ,是 新 闻 公告 内 容 编辑 区 域 ,使 用 了 一 个 FCKeditor( 在 线 编辑 ) 控 件 ,和 
标准 的 textarea( 多 行文 本 框 ) 控 件 相 比 , 它 支持 html 格式 ,以 及 在 内 容 中 输入 插图 和 图 表 ， 
更 加 方便 和 强大 。 要 引用 FCKeditor 控件 ,首先 从 网 上 下 载 该 控件 ,复制 到 用 户 Web 应 用 
的 根 目 录 下 ,并 进行 相应 的 配置 ,然后 在 news-add. jsp 中 导入 。 代 码 如 下 : 


<% @ page import = "net. fckeditor. * "$%> 
<%@ taglib uri= "http://java. fckeditor. net" prefix= "FCK" %> 


下 面 是 news-add. jsp 中 forml 表单 涉及 的 相关 代码 。 
代码 清单 : news-add. jsp 中 forml 表单 定义 界面 核心 代码 


< form name = "forml”method = "post" action = "news - addsave. jsp"> 

< input type = "hidden" name = "newscode" value = "<$% = newscode %>"> 
< input type = "hidden" name = "addfilelist”value= ""> 

< input type = "hidden" name = "author" value = ""> 

< input type = "hidden" name = "workunit" value = ""> 

< input type = "hidden" name = "myauthor" value = ""> 


<tr height = "40"> 
<td class = "table_topic" colspan = "2" bgcolor = "#d6dff7">【 添 加 新 闻 公 告 KK/td> 
</tr> 
<tr height = "26"> 
<td class = "table_cell" width= "10% " align = "right"> 信 息 类 型 : </td> 
<td class = "table cell" align= "left"> 
< select name = "newstype" disabled> 

< 第 
for (int i= 0;i< newstypeopt. length; i++) 
{ 
%> 

<option value = "<% = newstypeopt[i] %>" <% = selectedstr[i] $>> <% = newstypeopt[i] %> 
</option> 
<% 
} 
%> 

</select> 

</td> 
</tr> 
<tr height = "26"> 

<td class = "table_cell" align = "right"> 标 题 : </td> 

<td class= "table cell" align= "left"> 
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< input name = "newstitle" type= "text" size= "90" maxlength= "100"> 

</td> 
</tr> 
<tr> 

<td class = "table cell" align = "center"> 详 <br > 细 < br > 内 < br > 容 </td> 

<td class = "table cell" align = "left"> 
<% 
net. fckeditor. handlers. PropertiesLoader. setProperty ( " connector. userFilesPath","/mynews/ 
upload" ) ; 
net. fckeditor. handlers. PropertiesLoader. setProperty ( " connector. userFilesAbsolutePath","/ 
mynews/upload" ) ; 

%> 
< FCK:editor instanceName = "newscontent" width= "100%" height = "300"> 
< jsp:attribute name = "value"> 输 入 正文 </jsp:attribute> 
<jsp:body> 
< FCK: config CustomConfigurationsPath = "d:/GSL5. 0/teacher/teacher. config. js" /> 
</jsp:body> 

</FCK:editor> 

</td> 
</tr> 
</form> 


在 forml 中 ,没有 表单 提交 按钮 ,forml 的 action 属性 设置 了 处 理 程序 ,但 不 会 被 执行 。 
它 是 通过 后 面 的 form3 中 的 “确定 ”按钮 提交 的 。 其 输入 数据 将 在 页 面 底 部 的 form3 中 通过 
“提交 ”按钮 统一 提交 ,如 果 单 独 提交 ,将 出 现 程 序 运行 不 稳定 的 错误 ,也 就 是 说 ,有 时 候 数据 
提交 成 功 ,有 时 候 会 失败 。 


2. 表单 form3 定义 及 多 表单 数据 的 提交 


表单 form3 包含 “确定 ”和 “取消 ”按钮 ,以 实现 整个 页 面 数 据 的 提交 或 放弃 。form3 定 
义 及 核心 代码 如 下 。 
代码 清单 : news-add. jsp 中 form3 表单 定义 界面 核心 代码 


< form name = "form3" method= "post"> 
<tr height = "26"> 
<td class = "table_cell" align = "right"> 作 者 : </td> 
<td class= "table cell" align= "left"> 
< input name = "author" type = "text" value= "<% = truename % >" size= "20"> 
部 门 : < input name = "workunit" type = "text"” value = "中 心 办 公 室 " size = "20"> 
</td> 
</tr> 
<tr height = "30"> 
<td class = "table cell" colspan = "2" align = "center"> 
< input type = "button" value = "提交 ” class = "mybutton" onclick = "formlSubmit( )"> Snbsp; 
< input type = "button" value = "取消 " class = "mybutton" onclick = "myFormCancel()"> 
</td> 
</tr> 
< input type = "hidden" name = "myauthor" value = "<% = truename %>"> 
</form> 


<form name = "formcancel" action= "news — addcancel. jsp?" method= "post"> 
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< input type = "hidden" name = "newscode" value = "<% = newscode 当 >"> 
< input type = "hidden" name = "addfilelist" value= ""> 
</form> 


在 form3 中 定义 了 多 个 hidden 元 素 , 目 的 是 将 forml 和 form2 表单 数据 复制 到 form3 
中 ,通过 form3 一 并 提交 。 此 外 ,我 们 还 定义 了 一 个 formcancel 表达 ,对 应 “取消 ”按钮 。 单 
击 “ 提 交 ” 按 钮 ,执行 form123Submit() 函数 ,对 应 的 客户 端 脚本 程序 如 下 。 

代码 清单 : news-add. jsp 中 form3 表单 提交 核心 代码 


A 
// forml 表单 数据 有 效 性 验证 
function formlDataValid() 
{ 
if (document. forml. newstitle. value == "") 
{ 
alert(" 信 息 标题 不 能 为 空 !") ; 
document. forml. newstitle. focus( ); 
return false; 
} 
if (document. forml. newscontent. value == 


€ 


"") 


alert(" 信 息 内 容 不 能 为 空 !"); 
return false; 
} 
return true; 
} 
A 
// 将 form2、form3 的 数据 复制 到 forml 的 hidden 元 素 , 通 过 forml 的 action 属性 提交 到 服务 器 
// 之 所 以 使 用 forml 提交 而 不 用 form3 提交 ,是 因为 forml 中 包含 FCKeditor 元 素 , 不 好 复制 
// 到 form3 
function formlSubmit() 
{ 
if (!formlDataValid()) 
return false; 
// (1) 取 Form2 表单 数据 , 即 iframe 中 的 文件 列表 ,存储 已 有 的 附件 信息 
var iframestr = document.filelistbox. document.body. innerText; 
if (iframestr. length> 0) 
{ 
document. forml .addfilelist. value = iframestr. substring(0, iframestr. indexOf("#")); 
} 
// (2) 将 form3 数据 复制 到 form1, 包括 隐 藏 (hidden) 控 件数 据 


document. form1. author. value = document. form3.author. value; 
document. form1. workunit. value = document. form3. workunit. value; 
document. form1. myauthor. value = document. form3.myauthor. value; 


// (3) 将 forml 中 的 所 有 disable 输入 元 素 取消 disable, 以 便于 数据 提交 
var len = document. form]. elements. length; 

Var i; 

for (i=0;i<len;it+) 

{ 


document. forml.elements[i].disabled = false; 
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有 

document. form1. submit( ); 
} 
OANA 
// form3“ 取 消 ” 按 钮 处 理 函数 ,调用 formcancel. submit(), 进 而 调用 formcancel 的 action 
function myFormCancel() 
{ 

var iframestr = document.filelistbox. document. body. innerText; 

document. formcancel.addfilelist. value = iframestr. substring(0, iframestr. indexOf("#")); 

document. formcancel. submit( ); 


1 


在 form3 中 定义 了 多 个 hidden 元 素 , 目 的 是 将 forml 和 form2 表单 数据 复制 到 form3 
中 ,通过 form3 一 并 提交 。 此 外 ,我 们 还 定义 了 一 个 formcancel 表单 ,对 应 “取消 ?按钮 。 表 
单 “提交 ”对 应 的 客户 端 脚 本 程序 如 下 。 


3. 表单 数据 的 保存 


当 表单 提交 后 ,在 服务 器 端 执行 news-addsave. jsp 文件 , 读 取 用 户 的 表单 输入 数据 ,并 
存储 到 相应 的 数据 表 中 。 部 分 核心 代码 清单 如 下 。 
代码 清单 : news-addsave. jsp 


<% @ page contentType = "text/html;charset = GBK" %> 
<%@ include file="../session-confirm. jsp” %> 
<%@ page import = "java. sql. * " %> 


< jsp:useBean id = "gslpub" scope = "page" class = "pub.db gslpub" /> 

< jsp:useBean id = "mytime" scope = "page" class = "pub. mytime"/> 

< jsp:useBean id = "gb2312" scope = "page" class = "pub. ISOtoGb2312" /> 
< jsp:useBean id = "workH" scope = "page" class = "pub. CodeFilter" /> 
<S%! 

int retval; 

%> 

<% 

String newsdate = mytime. getTime( ); 

String ss = mytime. getcurrenttime() 7 


String newscode = request. getParameter ("newscode" ); 

String newstitle = gb2312. convert (request. getParameter("newstitle" ) ) ; 
String newscontent = gb2312. convert(request. getParameter( "newscontent")); 
String addfilelist = gb2312. convert(request. getParameter("addfilelist")); 


// 将 text 文本 转换 成 HTML 格式 存储 到 数据 库 中 
newscontent = newscontent. trim( ); 
//newscontent = workH. toHtm] (newscontent) ; 


String strSQL; 

strSQL = "INSERT INTO news(NewsCode, NewsTitle, NewsContent, AddfileList, NewsDate) VALUES 
("+ "'"+ newscode 
+ "',N'" + newstitle 
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+ "',N'" + newscontent 
+ "',N'" + addfilelist 
+ "vv + newsdate 
+ "mi 
try{ 
retval = gslpub. executeUpdate( strSQL) ; 
) 


catch (Exception ex){ 
out. print(ex. getMessage() ) ; 
} 
finally { 
gslpub. disconnectToDB( ); 
) 
%> 
< 第 
if (retval == 1) 
{ 
%> 
<html> 
<head> 
< meta HTTP — EQUIV = "Content - Type" content = "text/html; charset = gb2312"> 
</head> 
<body bgcolor = "#799ael" leftmargin = "0" topmargin= "0"> 
<table width = "60%" border = "1" cellpadding = "0" cellspacing = "0" bordercolor = " #FFFFFF"> 
<tr height = "40"> 
<td class = "table_topic" align = "center"> 信 息 添加 成 功 </td> 
</tr> 
<tr height = "77"> 
<td class = "table_cel1"> 您 已 经 成 功 添 加 了 信息 : <% = newstitle%></td> 
</tr> 
<tr height = "30"> 
<td class = "table cell">[<a href = "news - add. jsp"> 继 续 添加 </a>]</td> 
</tr> 
</table> 
</body> 
</html > 
<% 
} 
%> 


在 上 述 代码 中 ,用 到 了 几 个 JavaBean, 其 中 ISOtoGB2312 负责 汉字 编码 的 转换 ， 
CodeFilter 用 于 将 HTML 中 保留 的 一 些 符 号 (例如 >、< 等 ) 进 行 转换 ,避免 在 页 面 输出 这 些 
符号 时 与 HTML 标记 出 现 解析 错误 。 这 些 代码 的 介绍 略 。 


6.7 Web 系统 的 设计 与 开发 


在 本 书 的 最 后 ,我 们 将 通过 在 线 聊天 程序 的 开发 来 对 所 学 的 知识 进行 综合 的 应 用 。 在 
线 聊 天 是 许多 网 站 都 提供 的 一 种 功能 , 它 包 含 服 务 端 开发 、 客 户 端 开发 、 AJAX 技术 、 
JavaBean 以 及 数据 库 的 应 用 ,涉及 的 内 容 比 较 全 面 , 相 对 容易 理解 。 
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6.7.1 系统 分 析 


在 线 聊 天 程序 系统 中 ,用 户 可 分 为 管理 员 用 户 和 普通 用 户 ,普通 用 户 可 以 选择 聊天 对 
象 ,发 送 聊 天 信息 ,管理 员 可 以 对 在 线 用 户 发 出 警告 ,甚至 将 用 户 踢 出 聊天 室 。 

聊天 程序 设计 包括 两 个 方面 ,一 方面 是 客户 端的 用 户 界面 , 另 一 方面 是 服务 端的 数据 库 
操作 ,用 于 记录 用 户 的 聊天 记录 。 此 外 ,为 避免 用 户 聊 天 信息 更 新 带 来 的 页 面 闪烁 ,我 们 采 
用 AJAX 技术 ,来 进行 客户 端 和 服务 端的 异步 数据 传输 。 


6.7.2 系统 设计 


在 系统 分 析 完 成 后 , 接 下 来 就 是 系统 设计 。 系 统 设计 可 分 为 功能 设计 和 数据 库 设计 两 
个 方面 。 功 能 设计 就 是 根据 需求 分 析 ,设计 系统 的 整体 框架 .系统 的 各 项 功能 ,建立 系统 功 
能 树 。 由 于 本 系统 功能 很 简单 ,详细 的 系统 功能 设计 略 。 

聊天 数据 库 记 录 聊 天 社区 、 聊 天 主题 和 聊天 记录 ,包括 三 个 数据 表 : 社区 数据 表 、 主 题 
数据 表 ( 房 间 ) 和 聊天 记录 数据 表 。 结 构 定 义 如 下 。 

(1) 社区 数据 表 topic: 社区 数据 表 存储 要 进入 的 一 级 主题 。 结 构 定义 如 图 6-11 所 示 。 

(2) 主题 数据 表 (房间 )second_topic: 存储 聊天 主题 , 即 一 般 的 房间 。 结 构 定 义 如 图 6-12 
所 示 。 


int 局 
nvarchar(255) 区 
nyarchar(255) ba 
nvarchar(255) 区 

已 


图 6-11 社区 数据 表 topic 结构 定义 6-12 ”主题 数据 表 ( 房 间 )second_topic 结构 定义 


(3) 聊天 记录 数据 表 chat: 记录 聊天 信息 及 系统 公告 。 结 构 定义 如 图 6-13 所 示 。 


口 
区 
区 
La 
La 
La 
La 
La 
区 
区 
Ia 
区 
区 
口 


图 6-13 ”聊天 记录 数据 表 chat 结构 定义 
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6.7.3 ”客户 端 页 面 设计 


聊天 程序 主要 涉及 一 个 用 户 界面 ,这 就 是 客户 端 用 户 界面 。 客 户 端 用 户 界面 通常 分 成 
几 个 区 域 : 用 户 列表 、 聊 天 信息 输入 区 域 .聊天 记录 显示 区 域 。 上 述 用 户 界面 可 以 通过 
HTML 的 表格 和 图 层 来 布局 。 常 见 的 用 户 界 面 如 图 6-14 所 示 。 


加 attp://202. 194. 28. 15 - 讨论 - icresoft Internet Explorer 


| osL | 在 本 交流 | | 
一 | 55 家 说 : 大 家 好 [2009-06- 

迎 未 到 在 线 交 | 了 系 缮 看 知 】 : 于 殊 加 入 了 我 们 的 讨论 C20 
降 or 杨 海 藻 油 笑 获 对 大 家 说 : 好 (2009-06-24 0 
现在 所 在 主题 : 于 斑 烤 笑 着 对 杨 海 薪 涪 : 老师 好 


《诗经 》 《东部 》 


个 人 信息 


用 户 帐号 : 
20071202087 


姓名 : 王 下 
角色 : 学 生 


| 


| 
| 当前 在 线 2 人 


图 6-14 聊天 系统 客户 端 用 户 界面 


聊天 系统 客户 端 界 面 分 成 三 个 区 域 , 左 侧 为 用 户 信息 显示 区 域 ,显示 用 户 个 人 信息 和 在 
线 用 户 列表 ; 右 侧 上 部 为 聊天 记录 的 显示 区 域 ,下 部 为 用 户 输入 区 。 下 面 介 绍 各 个 部 分 的 
实现 代码 ,包括 聊天 主 界面 代码 清单 。 


1. 客户 端 用 户 界面 chat-frame.jsp 


聊天 程序 的 主 界面 页 面 为 chat_frame. jsp, 采 用 在 Table 中 插入 iframe 方式 ,实现 不 同 
区 域 的 功能 。 
代码 清单 : chat_frame. jsp 


<%@ page contentType = "text/html;charset = GBK" %> 

<% @ page import = "java. text. * "%> 

< 外 四 page import = "java. sql. * " %> 

< jsp:useBean id= "gslpub" scope = "pagen class = "pub. db gslpub" /> 
<jsp:useBean id= "mytime" scope = "page" class = "pub. mytime"/> 
<%! 
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vt 


String useraccount = "", truename, nickname, userrole; 
id 2,note="", dnow=""; 


String sqlString = ""; 
%> 
< 第 
topic_id _1 = request. getParameter("topic id 1"); 
topic_id 2 = request. getParameter("topic id 2"); 


session. setAttribute("topic id 1",topic id 1); 


session. setAttribute("topic id 2",topic id 2); 


useraccount = (String)session. getAttribute( "useraccount"); 


truename = (String) session. getAttribute( "truename"); 
nickname = (String) session. getAttribute( "nickname" ) ; 
if (nickname == null | | "".equals(nickname)) 
nickname = truename; 
userrole = (String) session. getAttribute("userrole"); 
dnow = mytime. getTime( ); 
try 
下 
//(1) 从 数据 库 中 清除 1 天 以 前 的 聊天 记录 
String sqlString = "DELETE FROM chat WHERE addtimel! ='" + dnow. substring(0,10) + ""™"; 
gslpub. executeUpdate( sqlString); 
//(2) 将 系统 通知 插入 到 数据 库 中 
note = "「[ 系 统 通知 ]: ”+ nickname + "加 入 了 我 们 的 讨论 "; 
sqlString = "INSERT INTO chatting(topic_id 1,topic_id 2,username, userid, userclass, 
to_user, color, face, note, addt ime, addt imel, mode) values( " 
"+ topic id 1 
2 topic.id2 
"WN'" + nickname 
网 本 + useraccount 
"',N'" + userrole 
"RN + "大 家 " 
"+ "#f£0000" 
"Nm + "无 " 
"RN + note 
"+ dnow 
1, + dnow. substring(0,10) 
en 
gslpub. executeUpdate( sqlString) ; 


二 十 十 十 十 十 十 十 十 十 二 ++ 


} 
catch(Exception ex){ 
out. print (ex. getMessage( )); 
} 
finally{ 
gslpub. disconnectToDB( ); 
} 
第 > 


< htm]l xmlns = "http://www. w3.org/1999/xhtml"> 

<head> 

<meta http - equiv = "Content — Type" content = "text/html; charset = gb2312" /> 
</head> 
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<body> 
<table id= "main table" width="100%" height = "97%" cellpadding = "0" cellspacing = "0"> 
过 到 和 
< td rowspan = "2" width= "250px"> 
< iframe name = left frameBorder = 0 scrolling = auto src = "chat - left. jsp"></iframe> 
</td> 
<td id= "right" height = "70%"> 
< iframe name = right frameBorder = 0 scrolling = no src = "chat -client.html"></iframe> 
</td> 
</tr> 
<tr> 
<td> 
< iframe name = bottom frameBorder = 0 scrolling = no src = "chat - input. jsp"></iframe> 
</td> 
</tr> 
</table> 
< script> 
this.moveTo(0,0) 
this. resizeTo( screen. availWidth, screen. availHeight) 
</script > 
</body> 
</html > 


在 上 述 代 码 中 ,为 了 保证 界面 的 灵活 性 ,引用 了 一 个 css 文件 chat. css, 代 码 从 上 略 。 
2. 左 侧 信 息 列表 chat-left. jsp 


左 侧 显示 用 户 信 息 ,在 线 用 户 列表 等 。 
代码 清单 : 


<% @ page contentType = "text/html;charset = GBK" %> 

< 外 四 page import = "java. text. * " %> 

<% @ page import = "java. sql. * "%> 

< jsp:useBean id = "gslpub" scope = "page" class = "pub. db gslpub" /> 
< 第 上 

String useraccount 


,truename, nickname, userrole; 

String topic_id 1,topic id 2,topic name; 

String sqlString = ""; 

ResultSet rs = null; 

第 > 
<% 

useraccount = (String)session. getAttribute( "useraccount"); 
truename = (String) session. gethttribute("truename" ) ; 
nickname = ( String) session. getAttribute( "nickname"); 

if (nickname == null || "".equals(nickname) ) 

nickname = truename; 

userrole = (String) session. getAttribute("userrole"); 
topic_id 1 = (String)session. getaRttribute("topic_id 1"); 
topic_id 2 = (String)session. getAttribute("topic id 2").trim(); 


try{ 
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rs= gslpub. executeQuery("SELECT # FROM chattopic2 WHERE id= '"+topic id 2+""); 
rs. next(); 
topic name = rs. getString("topic_name" ) 
} 
catch(Exception ex) { 
out. print (ex. getMessage( ) ); 
} 
finally{ 
rs=null; 
gslpub. disconnectToDB( ); 
} 
%> 
< htm]l xmlns = "http://www. w3.org/1999/xhtml"> 
<head> 
<meta http 一 equiv = "Content - Type" content = "text/html; charset = gb2312" /> 
< script language = "JavaScript"> 
A 
// 将 在 线 用 户 列表 中 选择 的 聊天 对 象 ,显示 在 页 面 的 bottom 浮动 帧 中 
function toperson(user) 
{ 
Pparent. bottom. form]. to_user. value = user; 
return false; 
} 
</script > 
</head> 


<body> 


<table width= "93%" cellpadding = "0" cellspacing = "0"> 
<tr> 
<td class = "rowl1"><b> 在 线 信息 </b></td> 
</tr> 
<tr> 
<td> 
<table class = "welcome" cellpadding = "0" cellspacing = "0" border = "0"> 
<% 
sqlString = "SELECT username FROM chatting WHERE topic id 1='"+topic id 1+"'AND topic id 2 
= '"+topic_id 2+"'GROUP BY username"; 
rs = gslpub. executeQuery(sqlString); 
rs. last(); 
int online nums = rs. getRow(); 
第 > 
<tr height = "20px"> 
<td> 当 前 在 线 < font color = "#0033FF"><b><% = online_nums%></b></font> 人 </td> 
</tr> 
<tr height = "20px"> 
<td> 在 线 用 户 列表 : </td> 
</tr> 
<% 
rs.absolute(1); 
String tousername; 
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tousername = rs. getString( "username" ); 
第 > 
<tr height = "20px"> 
<td> 
<a href ="#" onClick = "toperson('<% = tousername%> ') " ><% = tousername %$></a> 
</td> 
</tr> 
<% 
} while(rs. next()); 
%> 
</table> 
</td> 
</tr> 
</table> 
<table class = "table" width= "93%" cellpadding = "0" cellspacing = "0"> 
<tr> 
<td class = "rowl"><b><a href = "chat - exit. jsp" target = ' parenty> 离 开 该 话题 </a></b> 
</td> 
</tr> 
</table> 
</body> 
</html > 


需要 说 明 的 是 , 当 一 个 用 户 登 录 聊 天 界面 时 ,系统 发 一 个 公告 消息 ,同时 将 该 用 户 存 储 
在 聊天 数据 表 chat 中 ,通过 该 数据 表 , 可 以 显示 在 线 用 户 列表 。 
在 上 述 代码 中 ,因为 要 显示 用 户 列表 ,我 们 查询 了 整个 数据 表 , 如 果 仅 仅 是 统计 在 线 人 
数 ,可 以 使 用 下 面 的 SQL 指令 : 
sqlString = "SELECT COUNT(DISTINCT userid) AS nums " 
+ "FROM chatting " 
+"WHERE (topic_id 1 = '"+ topic id 1+ "') AND (topic_ id 2 = "'+ topic id 2'" 
rs = gslpub. executeQuery(sqlString); 
if (rs.next()) 
int online nums = rs.getInt("nums"); 
上 述 SQL 查询 的 结果 集 只 包含 一 条 记录 ,效率 更 高 。 因 此 ,在 数据 库 的 操作 中 ,要 优化 
SQL 指令 ,以 提高 服务 器 效率 。 
对 于 左 侧 最 下 面 的 “离开 该 话题 ” 超 链接 ,执行 chat-exit. jsp, 和 进入 一 个 话题 类 似 , 在 
chatting 数据 表 中 插入 一 条 广播 消息 记录 ,代码 略 。 
此 外 ,由 于 在 线 用 户 列 表 是 动态 变化 的 ,不 断 地 会 有 新 的 用 户 进入 ,也 会 有 用 户 退 出 , 因 
此 用 户 列表 需要 实时 更 新 以 反映 在 线 用 户 实际 的 情况 。 


3. 用 户 输 入 页 面 chat_input. jsp 


在 聊天 程序 界面 的 右 下 部 ,是 用 户 的 输入 区 ,输入 信息 后 ,同时 将 输入 信息 保存 到 聊天 
数据 库 中 。 在 chat-input. jsp 文件 中 ,Form 表单 的 action 属性 设置 为 chat-input. jsp 文件 
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本 身 ,第 一 次 连接 到 该 文件 时 , 即 进 入 聊天 室 , 只 将 公告 存储 到 聊天 数据 表 chat 中 。 
输入 页 面 chat_input. jsp 关键 代码 清单 如 下 : 


<% @ page contentType = "text/html;charset = GBK" %> 
<%@ page import = "java. text. x* " %> 

<%@ page import = 
< jsp:useBean id= "gslpub" scope = "page" class = "pub. db_gslpub" /> 

< jsp:useBean id = "gb2312" scope = "page" class = "pub. ISOtoGb2312" /> 
< jsp:useBean id = "mytime" scope = "page" class = "pub. mytime"/> 


java. sql. * " %> 


<html xmlns = "http://www. w3.org/1999/xhtml"> 
<head> 
<meta http— equiv = "Content - Type" content = "text/html; charset = gb2312" /> 
< script language = "javascript"> 
A 
// 验 证 数据 的 合法 性 
function formlsubmit() 
{ 
if (forml. content. value == 


‘ 


"") 


alert(" 请 输入 内 容 !"); 
forml. content. focus(); 
return false; 


} 
</script > 
</head> 
<body> 
< form name = "forml" method = "post" action= "chat - input. jsp" onSubmit = "return formlsubmit 
()"> 
<table cellpadding = "0" cellspacing = "0" border = "0"> 
<tr height = "30px"> 
<td style= "text — align:left;margin ~ right:30px;"> 
对 象 : < input class = "pas" type = "text" name = "to_user" value = "大 家 "/> &nbsp; &nbsp; 
字体 颜色 : 
< select name = 'fontcolor' id = 'fontcolor' size= "1" style= "font— size:9pt"> 
! 并 3333ff' style = 'color: #3333ff > 默认 </option> 
< option value = '# 000000' style = 'color: #000000> 黑 色 </option> 
< option value = ' 间 008800' style = 'color: # 008800> 橄 榄 </option> 
</select > gnbsp; &nbsp; 
动作 与 表情 : < select name = 'mode' id = 'mode'> 
<option value = ' 微 笑 着 > 微笑 </option> 
<option value = ' 高 兴 地 > 高 兴 </option> 
< option value = ' 满 意 地 > 满意 </option> 
<option value= ' 痛 苦 地 > 痛苦 </option> 
</select> 
< font color = "#0033FF"> 留 言 内 容 不 要 超过 150 字 </font > 
</td> 
</tr> 
<tr height = "60px"> 


< option valut 
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<td> 内 容 : < textarea name = "content" cols= "95" rows="3" class= "textarea"></textarea> 
</td> 
</tr> 
<tr height = "35px"> 

<tdalign= "center"> 
"submit" value 


reset" value= 


< input type 
<input type= 
</td> 

</tr> 

</table> 

</form> 

</body> 

</html> 


"提交 " class = "menu"> gnbsp; &nbsp; 
重 置 " class = "menu"> 


<%! 
String useraccount, truename, nickname = "", userrole = ""; 
String topic_id 1,topic_id 2,nowtime="",chat record= ""; 


String sqlString= ""; 
第 > 
<# // 接 收 客户 端 提交 的 数据 


String to_user = (request. getParameter("to user"); 
if(to_user == null) to_user = "大 家 "; 

String fontcolor = request. getParameter("fontcolor" ); 
if(fontcolor == null) fontcolor = ""; 

String mode = request. getParameter( "mode" ) ; 

if(mode == null) mode = " "7 

String content = codeToString(request. getParameter("content") ) ; 
if(content == null) content = ""; 

useraccount = (String) session. getAttribute( "useraccount"); 
truename = (String) session. getAttribute("truename"); 

nickname = (String) session. getAttribute("nickname" ); 

if (nickname == null | | "".equals(nickname) ) nickname = truename; 
userrole = (String) session. getAttribute("userrole"); 


证 (!("".equals(content))) // 如 果 输 入 内 容 不 为 空 , 则 执行 插入 数据 库 操作 
{ 
chat_record = nickname + mode + "对 " + to_user + "说 : "+ content; 
nowtime = mytime. getTime( ); 
sqlString = " insert into chatting (username, userid, to_ user, color, face, note, addtime, 
addtimel) values(" 
+"',N'" + nickname 
+"','" + useraccount 
er 
十 "mw + fontcolor 
+"','" + mode 
+"',N'" + chat_record 
+ "vv + nowtime 
+"','" + nowtime. substring(0,13) 
ey 
gslpub. executeUpdate( sqlString); 
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上 述 代 码 分 为 两 个 部 分 ,第 一 部 分 是 显示 界面 ,第 二 部 分 的 JSP 程序 用 于 存储 聊天 记 
录 。 若 聊天 内 容 输入 为 空 , 则 不 执行 数据 表 插 入 记录 操作 。 


4. 聊天 信息 显示 chat-client. htm 


在 聊天 程序 界面 中 ,右上 侧 显示 聊天 信息 ,为 避免 刷新 整个 页 面 而 引起 的 屏幕 闪烁 , 采 
用 AJAX 技术 ,客户 端 代码 为 一 个 html 页 面 chat-client. htm。 
代码 清单 : 


< html > 
<head> 
<meta http— equiv = "Content - Type" content = "text/html; charset = GBK"> 
<script> 
MAA 
// 滚动 条 置 底 
function scrollWindow() 
{ 
scroll(0, 100000); 
setTimeout('scrollWindow()', 200); 
} 
function convert (str) 
{ 
if (str! ="") 
{ 
str = str. replace(/\r/g,""); 
} 
return str; 
} 
LALLLLLLLAALLLLALLALLALLLLAALLALLLLALLALLALLALLLLLALLLLLLLLALLAALLLLALLLALLLALLLAALLN 
// 创建 XMLHttpRequest 对 象 
var XMLHttpReq; 
function createXMLHttpRequest() 
{ 
if(window. XMLHttpRequest) 
{ //Mozilla 浏览 器 
XMLHttpReq = new XMLHttpRequest(); 
} 
else if (window. ActiveXObject) 
{ 
// 焉 浏览 器 
try { 
XMLHttpReq = new ActiveXObject("Msxml2.XMLHTTP"); 
} 
catch (e) { 
try 
{ 
XMLHttpReq = new RctiveXObject("Microsoft.XMLHTTP" ) ; 
} 
catch (e){} 
} 
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} 
} 
A 
// 指 定 服务 端 程序 
function sendRequest() 
{ 
createXMLHEtpRequest( ); 
Var url = "chat - server. jsp"; 
XMLHttpReq. open( "POST", url, true); 
XMLHttpReq. setRequestHeader( "Content — Type", "application/x — www — form— urlencoded" ); 
XMLHttpReq. onreadystatechange = processResponse; // 指 定 响应 函数 
XMLHttpReq. send( ); // 发 送 请 求 


scroll(0, 100000); 
chat_content. scrollTop = chat_content. scrollHeight; 
setTimeout("sendRequest( )", 800); 
} 
A 
// 处 理 返 回信 息 函 数 ,指定 服务 端 输出 显示 的 id 
function processResponse( ) 
{ 
if (XMLHttpReq. readyState == 4) 
{ 
// 判 断 对 象 状态 
if (XMLHttpReq. status == 200) 
{ 
// 信 息 已 经 成 功 返回 ,开始 处 理 信息 
chat_content. innerHTML = convert(XMLHttpReq. responseText); 
} 
else 
{ 
// 页 面 不 正常 
window.alert(" 您 所 请 求 的 页 面 有 异常 ."); 
} 
} 
} 
</script > 
</head> 
<body onload = "sendRequest()"> 
<div id = "chat_content" style= "width:750px; height:450px; margin - top:10px; background:# 
FFFFFF; margin - left:10px;line— height:150% ; overflow:scroll;"> 
</div> 
</body> 
</html > 


现在 ,Web 开发 人 员 更 多 地 使 用 div 和 css 来 进行 页 面 布局 ,div 可 以 起 一 个 占 位 作用 
(定义 图 层 的 位 置 、 高 度 和 宽度 ) ,然后 通过 程序 来 动态 地 修改 div 中 的 内 容 , 或 者 改变 div 的 
显示 状态 。 在 上 述 程序 中 ,使 用 图 层 (id 二 "chat_content") 来 定义 聊天 记录 滚动 显示 区 域 。 
用 户 也 可 以 通过 textarea 来 定义 显示 区 域 ,两 者 的 不 同 是 ,在 div 定义 中 ,可 以 格式 化 显示 
html 文 本 ,但 textarea 中 ,不 能 显示 html 格式 化 内 容 。 
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6.7.4 服务 端 程序 设计 


在 服务 端 ,主要 完成 聊天 记录 的 数据 存储 和 查找 操作 。 主 要 涉及 的 程序 就 是 用 户 输入 
中 的 服务 端 脚本 部 分 ,同时 还 涉及 一 个 与 客户 端 聊 天 信息 显示 进行 异步 传输 的 服务 端 程序 ， 
两 者 共同 构成 AJAX 的 异步 传输 ,来 避免 用 户 界面 的 闪烁 。 

根据 AJAX 技术 的 工作 机 理 , 对 应 客户 端的 chat-client. htm 文件 ,服务 器 端的 处 理 程 
序 为 chat-server. jsp, 用 于 输出 聊天 记录 。 核 心 代码 清单 如 下 


<%(@ page contentType = "text/html;charset = GBK" %> 
<%@ page import = "java. text. * " %> 
<%@ page import = "java. sql. * "%> 
< jsp:useBean id = "gslpub" scope = "page" class = "pub. db gslpub" /> 
<%! 
String topic id 1="", topic id 2=""; 
String color text ="",color time="#999999",chat content ="",chat time=""; 
%> 
<% 
topic_id 1= (String)session. getAttribute("topic id 1"); 
topic_id 2= (String)session. getAttribute("topic_id 2"); 
ResultSet rs = null; 
try 
{ 
//topic_id 1 为 一 级 主题 ,topic_id_ 2 为 二 级 主题 ,topic_id_1= '0' 且 topic_id 2= '0 为 系统 公 
告 
String strSQL = "SELECT # FROM chatting " 
+ "WHERE(topic id 1='" + topic id 1 + " 
+ "AND topic_ id 2= + topic id 2 + "')" 
+ "OR(topic_id 1= '0'and topic id 2='0) " 
+ "ORDER BY id"; 
rs= gslpub. executeQuery( strSQL); 
while(rs. next()) 
{ 
color_text = rs.getString("color"); 
chat content = rs.getString("note"); 
Chat time= rs.getString("addtime"); 
out. print("< font color ="+color text + ">" + chat_content + "</font > &nbsp" + "< font 
color = "+ color _ time+ ">("+chat time+")</font>"); 
out. print("< br>"); 
} 
}// 外 层 try 结束 
catch(Exception ex) 
{ 


out. print(ex. getMessage( )); 


. 
finally 
{ 
rs=null; 
gslpub. disconnectToDB( ); 
} 
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在 AJAX 技术 中 ,服务 端的 out 输出 内 容 , 被 返回 ,然后 显示 在 客户 端 页 面 的 某 个 div、 
span 或 td 元 素 内 。 


6.8 Java 开发 工具 简介 


在 计算 机 开发 语言 的 历史 中 ,从 来 没有 哪 种 语言 像 Java 那样 受到 如 此 众多 厂商 的 支 
持 , 有 如 此 多 的 开发 工具 。 每 一 种 Java 开发 工具 各 有 所 长 ,各 有 特点 。 下 面 对 一 些 常见 的 
Java 开发 工具 进行 简要 介绍 。 


6.8.1 JDK 


Java 开发 工具 包 (JDK) 是 整个 Java 的 核心 ,包括 Java 运行 环境 ,Java 基础 类 库 和 一 组 
建立 ,测试 及 建立 文档 的 Java 实用 程序 ,这 些 实用 程序 包括 开发 用 的 Java 编译 器 (javac)、 
Java 解释 器 (java) .打包 工具 (jar) ,文档 生成 器 (javadoc) .调试 工具 (jdb) 等 。 不 论 什么 Java 
应 用 服务 器 ,实质 都 是 内 置 了 某 个 版 本 的 JDK. 掌 握 JDK 是 学 好 Java 的 第 一 步 。 

最 主流 的 JDK 是 Sun 公司 发 布 的 JDK, 一 般 有 三 种 版 本 , 即 J2SE( 标 准 版 )、J2EE( 企 
业 版 ) 和 J2ME, 其 中 ,J2SE 为 一 般 用 户 常 用 的 开发 环境 ,J2EE 主要 用 于 企业 级 J2EE 应 用 
程序 ,而 J2ME 则 用 于 移动 设备 .嵌入 式 设备 上 的 Java 应 用 程序 开发 。 不 同 的 版 本 包含 的 
包 也 不 相同 。 除 了 Sun 之 外 ,还 有 很 多 公司 和 组 织 都 开发 了 自己 的 JDK ,例如 IBM 公司 开 
发 的 JDK,BEA 公司 开发 的 Jrocket, 还 有 GNU 组 织 开 发 的 JDK ,等 等 。 其 中 IBM 的 JDK 
包含 的 JVM 运行 效率 要 比 Sun JDK 包含 的 JVM 高 出 许多 。 而 专门 运行 于 x86 平台 的 
Jrocket 在 服务 端 运行 效率 也 要 比 Sun JDK 好 很 多 。 

JDK 简单 易学 ,可 以 通过 任何 文本 编辑 器 (如 Windows 记事 本 、UltrEdit、 EditPlus、 
FrontPage 以 及 Dreamweaver 等 ) 编 写 Java 源 文件 ,然后 在 DOS 状态 下 通过 javac 命令 将 
Java 源 程序 编译 成 字 节 码 (. class 文件 ) ,通过 Java 命令 来 执行 编译 后 的 Java 文件 ,这 能 带 
给 DOS 时 代 程 序 员 美好 的 回忆 。 

从 初学 者 角度 来 看 ,采用 JDK 开发 Java 程序 能 够 很 快 理解 程序 中 各 部 分 代码 之 间 的 
关系 ,有 利于 理解 Java 面向 对 象 的 设计 思想 。 但 它 的 缺点 也 是 非常 明显 的 ,就 是 从 事 大 规 
模 企 业 级 Java 应 用 开发 非常 困难 ,不 能 进行 复杂 的 Java 软件 开发 ,也 不 利于 团体 协同 开 
发 。 即 便 如 此 ,JDK 仍然 是 许多 Java 专家 最 初 使 用 的 开发 环境 ,尽管 许多 编程 人 员 已 经 使 
用 第 三 方 的 开发 工具 ,但 JDK 仍 被 当做 Java 开发 的 重要 工具 。 


6.8.2 Sun NetBeans 集成 开发 环境 


NetBeans 是 一 个 全 功能 的 开放 源码 Java IDE, 可 以 帮助 开发 人 员 编 写 .编译 .调试 和 部 
署 Java 应 用 ,并 将 版 本 控制 和 XML 编辑 融入 其 众多 功能 之 中 。NetBeans 可 支持 Java 2 平 
台 标 准 版 (J2SE) 应 用 的 创建 ,采用 JSP 和 Servlet 的 2 层 Web 应 用 的 创建 ,以 及 用 于 2 层 
Web 应 用 的 API 及 软件 的 核心 组 的 创建 。 此 外 ,NetBeans 还 预 装 了 一 个 Web 服务 器 , 即 
Tomcat, 从 而 免除 了 烦琐 的 配置 和 安装 过 程 。 所 有 这 些 都 为 Java 开发 人 员 创 造 了 一 个 可 
扩展 的 开源 多 平台 的 Java IDE, 以 支持 他 们 在 各 自 所 选择 的 环境 ,如 Solaris、 Linux、 
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Windows 或 Macintosh 中 从 事 开 发 工作 。 

在 NetBeans 中 ,不 仅 可 以 开发 Java 程序 ,通过 安装 插件 ,也 可 以 开发 C/C++ 程序 。 目 
前 的 版 本 是 NetBeans IDE 6. 1, 其 中 NetBeans IDE 3.0 和 NetBeans IDE 5.0 都 有 中 文 版 
本 ,是 目前 进行 大 型 Web 应 用 开发 的 常用 开发 环境 。 用 户 可 以 从 Sun 的 官方 网 站 下 载 , 网 
址 是 http://www. sun. com/。 


6.8.3 Eclipse 开发 平台 


2001 年 11 月 ,IBM 公司 捐 出 价值 4000 万 美元 的 源 代码 组 建 了 Eclipse 联盟 ,业界 厂商 
合作 创建 了 Eclipse 平台 。Eclipse 允许 在 同一 IDE 中 集成 来 自 不 同 供应 商 的 工具 ,并 实现 
了 工具 之 间 的 互 操作 性 。 从 本 质 上 说 ,Eclipse 是 一 个 开放 源 代码 的 、 基 于 Java 的 可 扩展 开 
发 平台 , 它 只 是 一 个 框架 和 一 组 服务 ,用 于 通过 插件 组 件 构建 开发 环境 , 它 附带 了 一 个 标准 
的 插件 集 ,包括 Java 开发 工具 (Java Development Tools,JDT) 。 

Eclipse 是 一 个 Java IDE, 但 Eclipse 的 目标 不 仅 限 于 此 。Eclipse 还 包括 插件 开发 环境 
(Plug-in Development Environment,PDE) ,这 个 组 件 主要 针对 希望 扩展 Eclipse 的 软件 开发 人 
员 ,因为 它 允 许 他 们 构建 与 Eclipse 环境 无 颖 集成 的 工具 。Eclipse 是 使 用 Java 语言 开发 的 ,但 
它 的 用 途 并 不 限于 Java 语言 。 例 如 ,支持 诸如 C/C++、COBOL 和 Eiffel 等 编程 语言 插件 ， 
Eclipse 框架 还 可 用 来 作为 与 软件 开发 无 关 的 其 他 应 用 程序 类 型 的 基础 ,比如 内 容 管理 系统 。 

基于 Eclipse 的 应 用 程序 的 突出 例子 是 IBM 的 WebSphere Studio Workbench , 它 构成 
了 IBM Java 开发 工具 系列 的 基础 。 例 如 , WebSphere Studio Application Developer 添加 了 
对 JSP、Servlet、.EJB、XML、Web 服务 和 数据 库 访问 的 支持 。Eclipse 是 一 款 非常 受 欢 迎 的 
Java 开发 工具 ,用 户 越 来 越 多 。 它 的 缺点 是 比较 复杂 ,对 初学 者 来 说 ,理解 起 来 比较 困难 。 


体 章 小 结 


在 Web 开发 中 ,服务 端 编程 是 B/S 结构 中 最 复杂 的 内 容 , 它 不 仅 要 实现 用 户 的 业务 逮 
辑 , 还 包含 大 量 的 数据 库 操作 ,还 必须 保证 数据 库 操作 的 效率 和 安全 性 。 本 章 讲解 了 Java 
程序 设计 基础 以 及 JSP 技术 两 个 方面 ,首先 概要 性 地 介绍 了 Java 程序 设计 中 涉及 的 概念 ， 
为 JSP 编程 做 好 概念 上 的 铺垫 。 在 JSP 技术 中 ,以 任务 驱动 的 方式 ,讲解 了 服务 端 开 发 中 
遇 到 的 共性 问题 及 解决 办 法 ,包括 JSP 中 的 数据 类 型 及 其 转换 ,数组 ,文件 操作 、JSP 内 置 对 
象 .JSP 中 的 参数 传递 方法 以 及 JDBC 与 数据 库 编程 。 这 些 内 容 是 每 一 个 Web 应 用 中 都 可 
能 遇 到 的 ,在 讲解 中 给 出 了 许多 实用 的 代码 和 JavaBean 类 ,这 些 代码 都 来 源 于 我 们 的 研发 
项 目 ,读者 可 以 直接 应 用 在 自己 的 项 目 开发 中 。 


铝 题 6 


一 、 简 答题 
1. 简 述 Java 程序 设计 语言 的 特点 。 
2. 为 什么 说 Java 是 一 种 完全 面向 对 象 的 程序 设计 语言 ? 
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3. 在 面向 对 象 技术 中 ,回答 如 下 问题 : 

(1) 什么 是 类 ? 什么 是 对 象 ? 简 述 它 们 之 间 的 关系 。 

(2) 创建 一 个 对 象 有 哪些 方法 ? 

(3) 什么 是 类 的 构造 函数 ? 构造 函数 的 一 般 功 能 是 什么 ? 

4. 列举 主要 的 Java 开发 环境 ,它们 的 JDK 相同 吗 ? 

5. 说 明 Web 应 用 中 的 三 层 体系 结构 ,并 说 明 其 优势 。 

6. 在 JSP 页 面 中 ,说 明 下 列 三 条 page 指令 的 功能 。 

<%@ page import = "java. util. Date" %> 

<% @ page errorPage = "errorPage. jsp" $%> 

<%@ page session= "true" %> 

7. 在 JSP 中 ,有 哪些 常用 的 内 置 对 象 ? 简要 说 明 它们 的 功能 。 

8. 简要 说 明 Web 应 用 的 开发 过 程 。 

9. 在 JSP 中 ,在 二 %! … % 二 中 声明 变量 和 在 二 %…% 二 中 声明 变量 有 何不 同 ? 

10. 在 字符 串 对 象 的 操作 中 ,使 用 equals() 方 法 判断 两 个 字符 串 相 等 时 ,如 何 使 用 ,为 
什么 ? 使 用 trim() 方 法 来 操作 一 个 字符 串 变 量 时 ,如 果 发 生 异 常 , 为 什么 7 如何 修 改 。 

11. 在 JSP 中 ,有 一 个 表单 输入 页 面 myinput. htm, 对 应 的 表单 处 理 页 面 为 
myinputsave. jsp, 如 何在 myinputsave. jsp 中 获取 用 户 输入 ? 

12. 在 Web 应 用 ,页 面 之 间 的 参数 传递 有 哪些 常用 的 方法 ? 

二 、 编程 题 

1. 用 户 注册 是 大 多 数 Web 系统 共有 的 功能 。 设 计 一 个 新 用 户 注册 功能 ,要 求 ， 

(1) 注册 界面 采用 htm, 完 成 客户 端的 数据 有 效 性 验证 。 

(2) 在 用 户 账户 文本 框 后 面 , 设 计 “ 检 查 用 户 名 是 否 可 用 ” 超 链接 ,采用 AJAX 技术 编写 
相应 的 服务 端 数 据 库 检测 程序 ,检查 完毕 后 ,应 显示 账户 是 否 可 用 信息 。 

2. 编写 一 个 简单 的 作业 提交 系统 ,该 系统 具备 以 下 简单 功能 : 

(1) 用 户 注册 功能 ,人 允许 新 用 户 注册 。 

(2) 作业 提交 功能 , 当 用 户 首次 登录 后 ,在 作业 数据 目录 homework 下 建立 一 个 以 用 户 
账户 命名 的 子 文件 夹 ,存储 该 用 户 提交 的 作业 。 

(3) 作业 管理 功能 ,用 户 可 以 查看 自己 提交 的 作业 ,删除 已 经 提交 的 作业 ,或 者 重新 提 
交 作业 。 

3. 写 一 个 有 关 文 件 和 文件 夹 操作 的 JavaBean, 封 装 常用 的 文件 和 文件 夹 (目录 ) 操 作 ， 
例如 新 建文 件 夹 . 新 建文 件 、 删 除 文件 、 删 除 文件 夹 中 的 所 有 文件 .删除 文 件 夹 、 复 制 单个 文 
件 、 复 制 整 个 文件 夹 .移动 文件 到 指定 目录 移动 文件 夹 到 指定 目录 。 

4. 在 Web 系统 中 ,数据 浏览 .导入 导出 、 打 印 等 是 许多 系统 的 共有 功能 ,编程 实现 下 列 
功能 : 

(1) 任意 设计 一 个 数据 表 , 分 页 显示 数据 库 数据 表 中 的 数据 记录 。 

(2) 编程 实现 将 数据 表 导 出 为 Excel 表格 。 

(3) 编程 实现 页 面 的 打印 ,以 及 生成 Word 文档 。 

5. 使 用 数据 库 技术 和 JSP 开发 一 个 简单 的 留言 板 系 统 。 
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